/* ============== ROOT ============== */
:root{
  --cyan:#00fff5;
  --cyan-dim:#00b8b0;
  --yellow:#fff200;
  --yellow-dim:#b8ae00;
  --magenta:#ff2a8a;
  --violet:#b06bff;     /* BunnyLand identity accent (lavender bunny) */
  --green:#00ff66;
  --bg:#02030a;
  --bg-2:#070914;
  --grid:rgba(0,255,245,0.06);
  --scan:rgba(0,255,245,0.04);
  --font-display:'Orbitron',sans-serif;
  --font-body:'Rajdhani',sans-serif;
  --font-mono:'Share Tech Mono',monospace;
  --font-term:'VT323',monospace;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:#e8f9ff;
  font-family:var(--font-body);
  overflow-x:hidden;
  cursor:none;
  min-height:100vh;
  position:relative;
}
@media (pointer:coarse){ body{cursor:auto;} .cursor-dot,.cursor-ring{display:none;} }

/* ============== ============== */
@keyframes blink{50%{opacity:0;}}

/* ============== CUSTOM CURSOR ============== */
.cursor-dot, .cursor-ring{
  position:fixed;top:0;left:0;pointer-events:none;z-index:9999;
  transform:translate(-50%,-50%);mix-blend-mode:difference;
}
.cursor-dot{width:4px;height:4px;background:var(--cyan);border-radius:50%;box-shadow:0 0 14px var(--cyan);}
.cursor-ring{width:38px;height:38px;transition:transform .18s ease-out, width .25s, height .25s;}
.cursor-ring svg{width:100%;height:100%;overflow:visible;}
.cursor-ring .br{stroke:var(--yellow);stroke-width:2;fill:none;filter:drop-shadow(0 0 4px var(--yellow));transition:stroke .2s;}
.cursor-ring.hover{width:62px;height:62px;}
.cursor-ring.hover .br{stroke:var(--cyan);filter:drop-shadow(0 0 6px var(--cyan));}

/* ============== BG CANVAS ============== */
#bg-canvas{position:fixed;inset:0;z-index:0;pointer-events:none;}

/* ============== OVERLAYS ============== */
.scanlines{
  position:fixed;inset:0;z-index:2;pointer-events:none;
  background:repeating-linear-gradient(to bottom, transparent 0 2px, var(--scan) 2px 3px);
  opacity:.4;mix-blend-mode:overlay;
}
.vignette{position:fixed;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at center, transparent 35%, rgba(0,0,0,.85) 100%);}
.noise{
  position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='2' stitchTiles='stitch'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");
}

/* ============== TOP HUD ============== */
.hud-top{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;justify-content:space-between;align-items:center;
  padding:18px 32px;font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;
  color:var(--cyan);text-shadow:0 0 8px var(--cyan);pointer-events:none;
  background:linear-gradient(to bottom, rgba(2,3,10,.7) 0%, transparent 100%);
  backdrop-filter:blur(2px);
}
.hud-top .left, .hud-top .right{display:flex;gap:24px;align-items:center;}
.hud-top .blink{color:var(--green);text-shadow:0 0 8px var(--green);animation:blink 1.4s infinite;}
.hud-top .vio{color:var(--violet);text-shadow:0 0 8px var(--violet);}
@media (max-width:720px){.hud-top .left .item:nth-child(2){display:none;}}

/* ============== SIDE HUDs ============== */
.side-hud{position:fixed;top:50%;transform:translateY(-50%);z-index:30;font-family:var(--font-mono);font-size:9px;color:var(--cyan);text-shadow:0 0 6px var(--cyan);letter-spacing:.2em;pointer-events:none;opacity:.85;}
.side-hud.left{left:18px;}
.side-hud.right{right:18px;text-align:right;}
.side-hud .block{background:rgba(0,0,0,.4);border:1px solid rgba(0,255,245,.3);padding:10px 14px;margin:12px 0;clip-path:polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px));}
.side-hud .block .h{color:var(--violet);text-shadow:0 0 6px var(--violet);margin-bottom:8px;font-size:9px;}
.side-hud .bar{width:90px;height:3px;background:rgba(0,255,245,.15);margin:3px 0;position:relative;overflow:hidden;}
.side-hud .bar::after{content:'';position:absolute;left:0;top:0;height:100%;background:var(--cyan);box-shadow:0 0 6px var(--cyan);width:var(--w,60%);animation:bar-pulse 2.4s ease-in-out infinite;}
.side-hud.right .bar::after{background:var(--violet);box-shadow:0 0 6px var(--violet);}
@keyframes bar-pulse{0%,100%{filter:brightness(1);}50%{filter:brightness(1.5);}}
.side-hud .telem{font-size:10px;line-height:1.5;}
.side-hud .telem b{color:var(--violet);text-shadow:0 0 6px var(--violet);font-weight:normal;}
@media (max-width:1280px){.side-hud{display:none;}}

/* ============== NAV ============== */
nav.cyber-nav{position:fixed;top:54px;left:0;right:0;z-index:40;display:flex;justify-content:center;pointer-events:none;}
nav.cyber-nav ul{
  display:flex;gap:4px;list-style:none;background:rgba(2,3,10,0.75);backdrop-filter:blur(8px);
  border:1px solid rgba(0,255,245,0.3);padding:6px;pointer-events:auto;
  clip-path:polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
  box-shadow:0 0 30px rgba(0,255,245,.15);flex-wrap:wrap;justify-content:center;
}
nav.cyber-nav a{display:block;padding:10px 18px;font-family:var(--font-display);font-weight:700;font-size:11px;letter-spacing:.18em;color:#a8eaff;text-decoration:none;position:relative;transition:color .2s;z-index:1;}
nav.cyber-nav a::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--cyan),var(--violet));opacity:0;transition:opacity .25s;z-index:-1;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));}
nav.cyber-nav a:hover{color:#000;}
nav.cyber-nav a:hover::before{opacity:1;}
@media (max-width:600px){nav.cyber-nav a{padding:8px 12px;font-size:9px;}}

/* ============== HERO ============== */
.hero{position:relative;min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:60px;padding:170px 80px 80px;z-index:5;}
.hero-left{position:relative;z-index:1;}
.hero-left::before{
  content:'';position:absolute;inset:-32px -44px;
  background:linear-gradient(135deg, rgba(2,3,10,.82) 0%, rgba(7,9,20,.68) 100%);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:-1;
  clip-path:polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));
  border:1px solid rgba(176,107,255,.25);box-shadow:0 0 60px rgba(0,255,245,.1) inset, 0 0 40px rgba(0,0,0,.55);
}
.hero-left::after{content:'';position:absolute;top:-32px;right:-44px;width:22px;height:22px;background:linear-gradient(135deg, transparent 50%, var(--yellow) 50%);box-shadow:-2px 2px 0 rgba(255,242,0,.15);z-index:-1;pointer-events:none;}
.hero-tag{font-family:var(--font-mono);font-size:12px;letter-spacing:.4em;color:var(--yellow);text-shadow:0 0 10px var(--yellow);margin-bottom:24px;display:inline-flex;align-items:center;gap:12px;}
.hero-tag::before{content:'';width:30px;height:1px;background:var(--yellow);box-shadow:0 0 8px var(--yellow);}
.hero-tag .pulse{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 10px var(--green);animation:pulse-dot 1.2s infinite;}
@keyframes pulse-dot{0%,100%{transform:scale(1);}50%{transform:scale(1.4);}}
.hero h1{font-family:var(--font-display);font-weight:900;font-size:clamp(48px,8vw,128px);line-height:.9;letter-spacing:-.02em;color:#fff;position:relative;margin-bottom:8px;}
.glitch{position:relative;display:inline-block;text-shadow:0 0 30px rgba(0,255,245,.5);}
.hero h2{font-family:var(--font-display);font-weight:700;font-size:clamp(18px,2.2vw,30px);color:var(--violet);text-shadow:0 0 4px rgba(0,0,0,.95),0 2px 6px rgba(0,0,0,.9),0 0 18px var(--violet);letter-spacing:.1em;margin-top:8px;margin-bottom:24px;}
.bars{display:inline-flex;align-items:flex-end;gap:3px;height:24px;margin-left:18px;vertical-align:middle;}
.bars span{display:block;width:3px;background:var(--cyan);box-shadow:0 0 4px var(--cyan);animation:bar 1.2s ease-in-out infinite;}
.bars span:nth-child(1){animation-delay:0s;height:50%;}
.bars span:nth-child(2){animation-delay:.1s;height:80%;background:var(--yellow);box-shadow:0 0 4px var(--yellow);}
.bars span:nth-child(3){animation-delay:.2s;height:30%;}
.bars span:nth-child(4){animation-delay:.3s;height:65%;background:var(--violet);box-shadow:0 0 4px var(--violet);}
.bars span:nth-child(5){animation-delay:.4s;height:45%;}
@keyframes bar{0%,100%{transform:scaleY(.5);}50%{transform:scaleY(1.2);}}
.hero p.lead{font-size:18px;line-height:1.6;max-width:520px;color:#e6f6fc;margin-bottom:36px;text-shadow:0 1px 3px rgba(0,0,0,.95),0 0 8px rgba(0,0,0,.75);}
.hero p.lead .hi{color:var(--cyan);font-weight:600;text-shadow:0 0 6px rgba(0,255,245,.6), 0 1px 3px rgba(0,0,0,.9);}
.hero p.lead .hi-v{color:var(--violet);font-weight:600;text-shadow:0 0 6px rgba(176,107,255,.6), 0 1px 3px rgba(0,0,0,.9);}
.cta-row{display:flex;gap:18px;flex-wrap:wrap;}
.btn-cyber{position:relative;font-family:var(--font-display);font-weight:700;letter-spacing:.15em;font-size:13px;padding:16px 30px;text-decoration:none;color:#000;background:var(--cyan);clip-path:polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));transition:transform .2s, box-shadow .2s;box-shadow:0 0 24px rgba(0,255,245,.6);overflow:hidden;cursor:none;border:none;}
.btn-cyber::after{content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(120deg, transparent, rgba(255,255,255,.6), transparent);transition:left .6s;}
.btn-cyber:hover{transform:translateY(-2px);box-shadow:0 0 36px rgba(0,255,245,.9);}
.btn-cyber:hover::after{left:130%;}
.btn-cyber.violet{background:var(--violet);box-shadow:0 0 24px rgba(176,107,255,.6);color:#0a0014;}
.btn-cyber.violet:hover{box-shadow:0 0 36px rgba(176,107,255,.9);}
.btn-cyber.ghost{background:transparent;color:var(--cyan);border:1px solid var(--cyan);box-shadow:0 0 18px rgba(0,255,245,.25) inset;}
.btn-cyber.ghost:hover{background:rgba(0,255,245,.08);}

/* HERO RIGHT — live archive card */
.hero-right{position:relative;z-index:1;}
.archive-card{position:relative;border:1px solid rgba(255,42,138,.45);background:linear-gradient(160deg, rgba(10,2,20,.92), rgba(20,4,30,.85));padding:0;clip-path:polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 24px 100%, 0 calc(100% - 24px));box-shadow:0 0 50px rgba(255,42,138,.18), 0 0 30px rgba(0,0,0,.6);overflow:hidden;}
.archive-card .ac-top{position:relative;height:230px;overflow:hidden;background:radial-gradient(ellipse at 40% 30%, rgba(176,107,255,.5), transparent 60%),linear-gradient(135deg,#1a0830 0%,#3a0a4a 45%,#0a0418 100%);}
.ac-top .citylines{position:absolute;inset:0;background:repeating-linear-gradient(90deg, transparent 0 38px, rgba(0,255,245,.05) 38px 40px),repeating-linear-gradient(0deg, transparent 0 38px, rgba(255,42,138,.05) 38px 40px);}
.ac-top .bunny-emote{position:absolute;left:50%;top:54%;transform:translate(-50%,-50%);font-size:90px;filter:drop-shadow(0 0 18px rgba(176,107,255,.8));animation:logo-float 5s ease-in-out infinite;}
@keyframes logo-float{0%,100%{transform:translate(-50%,-50%) translateY(0);}50%{transform:translate(-50%,-50%) translateY(-8px);}}
.ac-top .tri{position:absolute;left:62%;top:30%;width:0;height:0;border-left:14px solid transparent;border-right:14px solid transparent;border-bottom:24px solid var(--yellow);filter:drop-shadow(0 0 8px var(--yellow));transform:rotate(20deg);opacity:.9;}
.ac-live{position:absolute;top:16px;left:16px;display:flex;align-items:center;gap:8px;font-family:var(--font-display);font-weight:900;font-size:13px;letter-spacing:.1em;z-index:2;}
.ac-live .badge{background:var(--magenta);color:#fff;padding:3px 9px;font-size:11px;box-shadow:0 0 12px var(--magenta);clip-path:polygon(0 0,calc(100% - 6px) 0,100% 100%,6px 100%);}
.ac-live .name{color:#fff;text-shadow:0 0 10px rgba(255,255,255,.4);}
.archive-card .ac-body{padding:22px 24px 26px;}
.ac-body h3{font-family:var(--font-display);font-weight:900;font-size:16px;line-height:1.35;color:#fff;letter-spacing:.04em;margin-bottom:6px;}
.ac-body h3 .ac-accent{color:var(--cyan);text-shadow:0 0 10px rgba(0,255,245,.5);}
.ac-body p{font-size:14px;color:#b9c9d6;font-family:var(--font-mono);margin-bottom:18px;}
.ac-stats{display:flex;gap:18px;margin-bottom:18px;font-family:var(--font-mono);font-size:11px;color:var(--cyan);letter-spacing:.1em;}
.ac-stats b{color:var(--yellow);font-weight:normal;text-shadow:0 0 6px var(--yellow);}

/* ============== SECTION HEAD ============== */
section{position:relative;z-index:5;padding:90px 80px;}
.section-head{margin-bottom:48px;}
.section-num{font-family:var(--font-mono);font-size:12px;letter-spacing:.35em;color:var(--yellow);text-shadow:0 0 8px var(--yellow);display:block;margin-bottom:14px;}
.section-title{font-family:var(--font-display);font-weight:900;font-size:clamp(34px,5vw,64px);color:#fff;letter-spacing:-.01em;line-height:1;}
.section-title .accent{color:var(--violet);text-shadow:0 0 24px rgba(176,107,255,.5);}
.section-sub{font-family:var(--font-body);font-size:17px;color:#9fb4c4;max-width:620px;margin-top:16px;line-height:1.5;}
.head-rule{height:2px;width:160px;margin-top:22px;background:linear-gradient(90deg,var(--cyan),transparent);box-shadow:0 0 10px var(--cyan);}

/* ============== VOD GRID ============== */
.vod-block{margin-bottom:70px;}
.vod-block-head{display:flex;align-items:baseline;gap:20px;margin-bottom:8px;flex-wrap:wrap;}
.vod-block-head h3{font-family:var(--font-display);font-weight:700;font-size:clamp(22px,3vw,34px);color:#fff;letter-spacing:.02em;}
.vod-block-head h3 .ac{color:var(--cyan);}
.dashed-tag{font-family:var(--font-mono);font-size:11px;color:var(--yellow);letter-spacing:.2em;border-top:1px dashed rgba(255,242,0,.4);border-bottom:1px dashed rgba(255,242,0,.4);padding:5px 0;margin:20px 0 26px;text-align:center;text-shadow:0 0 6px var(--yellow);}
.vod-rule{height:2px;width:100%;max-width:340px;background:linear-gradient(90deg,var(--cyan),transparent);box-shadow:0 0 8px var(--cyan);margin-bottom:30px;}
.vod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px;}
.vod-card{position:relative;text-decoration:none;display:block;border:1px solid rgba(0,255,245,.22);background:var(--bg-2);clip-path:polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 16px 100%, 0 calc(100% - 16px));transition:transform .25s, box-shadow .25s, border-color .25s;cursor:none;}
.vod-card:hover{transform:translateY(-5px);border-color:var(--violet);box-shadow:0 0 34px rgba(176,107,255,.3);}
.vod-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;}
.vod-thumb .scene{position:absolute;inset:0;}
.vod-thumb .vbunny{position:absolute;right:8%;bottom:0;font-size:84px;line-height:1;filter:drop-shadow(0 0 10px rgba(176,107,255,.7));transition:transform .3s;}
.vod-card:hover .vbunny{transform:translateY(-4px) scale(1.04);}
.vod-thumb .vtri{position:absolute;right:30%;bottom:30%;width:0;height:0;border-left:9px solid transparent;border-right:9px solid transparent;border-bottom:15px solid var(--yellow);filter:drop-shadow(0 0 6px var(--yellow));transform:rotate(18deg);}
.vod-thumb .gname{position:absolute;left:14px;top:12px;font-family:var(--font-display);font-weight:900;font-size:15px;color:#fff;letter-spacing:.04em;text-shadow:0 2px 6px rgba(0,0,0,.9),0 0 14px rgba(0,0,0,.7);max-width:60%;line-height:1.1;}
.vod-thumb .meta{position:absolute;right:10px;bottom:10px;font-family:var(--font-mono);font-size:11px;color:#fff;background:rgba(0,0,0,.65);padding:3px 8px;letter-spacing:.06em;clip-path:polygon(0 0,calc(100% - 5px) 0,100% 100%,5px 100%);}
.vod-thumb .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;display:flex;align-items:center;justify-content:center;background:rgba(2,3,10,.55);border:1px solid var(--cyan);border-radius:50%;opacity:0;transition:opacity .25s, box-shadow .25s;box-shadow:0 0 20px rgba(0,255,245,.5);}
.vod-card:hover .play{opacity:1;}
.vod-thumb .play .ptri{width:0;height:0;border-left:16px solid var(--cyan);border-top:10px solid transparent;border-bottom:10px solid transparent;margin-left:4px;filter:drop-shadow(0 0 4px var(--cyan));}
.vod-info{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;color:var(--cyan);}
.vod-info .views{color:var(--violet);text-shadow:0 0 6px rgba(176,107,255,.5);}
.show-more{display:inline-flex;align-items:center;gap:8px;margin-bottom:24px;font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.12em;color:var(--cyan);text-decoration:none;border-bottom:2px solid var(--cyan);padding-bottom:4px;transition:color .2s,border-color .2s;cursor:none;}
.show-more:hover{color:var(--yellow);border-color:var(--yellow);}

/* thumbnail scenes (CSS generated, per game) */
.scene-wd{background:linear-gradient(135deg,#0a1020 0%,#1b2740 50%,#0a0a10 100%);}
.scene-wd::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 30px,rgba(120,160,255,.08) 30px 32px);}
.scene-taxi{background:linear-gradient(180deg,#3aa6e0 0%,#7fc9e8 50%,#d9b24a 100%);}
.scene-taxi::after{content:'';position:absolute;left:0;right:0;bottom:0;height:38%;background:#2a2a32;}
.scene-mc{background:linear-gradient(160deg,#2f7d2f 0%,#1f5a1f 45%,#6b4a23 100%);}
.scene-mc::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 18px,rgba(0,0,0,.12) 18px 20px),repeating-linear-gradient(90deg,transparent 0 18px,rgba(0,0,0,.12) 18px 20px);}
.scene-outlast{background:radial-gradient(ellipse at 30% 40%,#34401f,#0a0d05 75%);}
.scene-beat{background:linear-gradient(135deg,#120024 0%,#3a0a5a 50%,#06000f 100%);}
.scene-beat::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(0,255,245,.12) 0 4px,transparent 4px 40px);}
.scene-chat{background:linear-gradient(135deg,#0a0418 0%,#2a0830 50%,#06050f 100%);}
.scene-chat::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 40%,rgba(255,42,138,.25),transparent 60%);}
.scene-horror{background:radial-gradient(ellipse at 50% 30%,#2a0d18,#050008 80%);}
.scene-horror::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 70% 60%,rgba(255,42,138,.18),transparent 55%);}

/* ============== ARCADE / MINIGAMES ============== */
.arcade-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:30px;}
.game-console{position:relative;border:1px solid rgba(0,255,245,.3);background:linear-gradient(170deg, rgba(7,9,20,.95), rgba(2,3,10,.98));clip-path:polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px));box-shadow:0 0 34px rgba(0,255,245,.08);overflow:hidden;}
.game-console .gc-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid rgba(0,255,245,.18);background:rgba(0,255,245,.04);}
.gc-head .gc-title{font-family:var(--font-display);font-weight:900;font-size:15px;letter-spacing:.08em;color:#fff;}
.gc-head .gc-title span{color:var(--violet);}
.gc-head .gc-hi{font-family:var(--font-mono);font-size:11px;color:var(--yellow);text-shadow:0 0 6px var(--yellow);letter-spacing:.06em;}
.gc-screen{position:relative;width:100%;aspect-ratio:4/3;background:#03040c;}
.gc-screen canvas{position:absolute;inset:0;width:100%;height:100%;display:block;image-rendering:pixelated;}
.gc-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;background:rgba(2,3,10,.78);backdrop-filter:blur(2px);transition:opacity .3s;padding:20px;}
.gc-overlay.hidden{opacity:0;pointer-events:none;}
.gc-overlay .ov-title{font-family:var(--font-display);font-weight:900;font-size:26px;color:#fff;letter-spacing:.04em;text-shadow:0 0 18px rgba(176,107,255,.6);}
.gc-overlay .ov-msg{font-family:var(--font-mono);font-size:13px;color:#9fb4c4;max-width:260px;line-height:1.5;}
.gc-overlay .ov-score{font-family:var(--font-mono);font-size:15px;color:var(--cyan);text-shadow:0 0 8px var(--cyan);}
.gc-play-btn{font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.14em;padding:12px 26px;color:#000;background:var(--cyan);border:none;cursor:none;clip-path:polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));box-shadow:0 0 22px rgba(0,255,245,.5);transition:transform .15s, box-shadow .15s;}
.gc-play-btn:hover{transform:translateY(-2px);box-shadow:0 0 32px rgba(0,255,245,.9);}
.gc-foot{padding:12px 18px;font-family:var(--font-mono);font-size:11px;color:#7e92a3;letter-spacing:.05em;border-top:1px solid rgba(0,255,245,.12);display:flex;justify-content:space-between;align-items:center;}
.gc-foot .live-score{color:var(--cyan);text-shadow:0 0 6px var(--cyan);}

/* ============== CONNECT ============== */
.socials{display:flex;flex-wrap:wrap;gap:16px;}
.social-link{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.1em;color:#cfe9f5;text-decoration:none;border:1px solid rgba(0,255,245,.25);padding:14px 22px;background:rgba(7,9,20,.6);clip-path:polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));transition:color .2s,border-color .2s,box-shadow .2s,transform .2s;cursor:none;}
.social-link svg{width:22px;height:22px;}
.social-link:hover{color:#000;border-color:var(--cyan);box-shadow:0 0 26px rgba(0,255,245,.5);transform:translateY(-2px);background:var(--cyan);}

/* ============== FOOTER ============== */
footer{position:relative;z-index:5;padding:70px 80px 40px;border-top:1px solid rgba(0,255,245,.15);background:linear-gradient(to top, rgba(7,9,20,.7), transparent);}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px;}
.foot-brand{font-family:var(--font-display);font-weight:900;font-size:26px;color:#fff;margin-bottom:14px;}
.foot-brand .accent{color:var(--violet);}
.foot-brand-sub{font-family:var(--font-mono);font-size:13px;color:#8ea3b3;line-height:1.6;max-width:320px;}
footer h4{font-family:var(--font-display);font-size:13px;letter-spacing:.12em;color:var(--yellow);margin-bottom:16px;text-shadow:0 0 6px var(--yellow);}
footer .foot-grid a{display:block;font-family:var(--font-body);font-size:15px;color:#9fb4c4;text-decoration:none;margin-bottom:9px;transition:color .2s;cursor:none;}
footer .foot-grid a:hover{color:var(--cyan);}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-family:var(--font-mono);font-size:11px;color:#6f8290;letter-spacing:.08em;padding-top:24px;border-top:1px solid rgba(0,255,245,.1);}

/* back to top */
.to-top{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.12em;color:#000;background:#fff;padding:12px 22px;border-radius:30px;text-decoration:none;margin-bottom:30px;transition:transform .2s,box-shadow .2s;cursor:none;}
.to-top:hover{transform:translateY(-2px);box-shadow:0 0 24px rgba(255,255,255,.4);}

/* ============== RESPONSIVE ============== */
@media (max-width:980px){
  .hero{grid-template-columns:1fr;gap:40px;padding:150px 28px 60px;}
  section{padding:70px 28px;}
  footer{padding:60px 28px 40px;}
  .foot-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:560px){
  .foot-grid{grid-template-columns:1fr;}
  .hero p.lead{font-size:16px;}
}

/* ============================================================
   FOX SHOP
============================================================ */
.shop-panel{position:relative;border:1px solid rgba(176,107,255,.35);background:linear-gradient(170deg,rgba(14,3,28,.96),rgba(2,3,10,.98));clip-path:polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));box-shadow:0 0 40px rgba(176,107,255,.12);margin-bottom:42px;overflow:hidden;}
.shop-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding:18px 24px;border-bottom:1px solid rgba(176,107,255,.2);background:rgba(176,107,255,.05);}
.shop-head .sh-title{font-family:var(--font-display);font-weight:900;font-size:18px;letter-spacing:.06em;color:#fff;display:flex;align-items:center;gap:10px;}
.shop-head .sh-title .fx{font-size:22px;filter:drop-shadow(0 0 8px var(--violet));}
.shop-head .sh-title span{color:var(--violet);}
.byte-bal{font-family:var(--font-mono);font-size:14px;letter-spacing:.08em;color:var(--yellow);text-shadow:0 0 8px var(--yellow);display:flex;align-items:center;gap:8px;}
.byte-bal .glyph{color:var(--cyan);text-shadow:0 0 8px var(--cyan);}
.byte-bal b{color:#fff;font-weight:normal;}
.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;padding:22px 24px 26px;}
.shop-item{position:relative;border:1px solid rgba(0,255,245,.18);background:var(--bg-2);padding:16px;clip-path:polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));display:flex;flex-direction:column;gap:8px;transition:border-color .2s, box-shadow .2s;}
.shop-item:hover{border-color:var(--violet);box-shadow:0 0 22px rgba(176,107,255,.2);}
.shop-item.owned{border-color:var(--green);}
.shop-item .si-top{display:flex;align-items:center;gap:10px;}
.shop-item .si-ic{font-size:26px;filter:drop-shadow(0 0 6px rgba(0,255,245,.4));}
.shop-item .si-name{font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.04em;color:#fff;line-height:1.1;}
.shop-item .si-tag{font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;color:var(--yellow);margin-top:2px;}
.shop-item .si-desc{font-family:var(--font-body);font-size:13px;color:#9fb4c4;line-height:1.4;flex:1;}
.shop-item .si-buy{margin-top:6px;font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.1em;padding:9px 12px;border:none;cursor:none;color:#000;background:var(--cyan);clip-path:polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 9px 100%, 0 calc(100% - 9px));transition:transform .15s, box-shadow .15s, background .2s;box-shadow:0 0 16px rgba(0,255,245,.4);}
.shop-item .si-buy:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 0 24px rgba(0,255,245,.8);}
.shop-item .si-buy.is-owned{background:var(--green);color:#02140a;box-shadow:0 0 16px rgba(0,255,102,.4);cursor:default;}
.shop-item .si-buy:disabled{background:#22303a;color:#5d7081;box-shadow:none;cursor:not-allowed;}
.shop-note{font-family:var(--font-mono);font-size:11px;color:#7e92a3;padding:0 24px 22px;letter-spacing:.04em;}

/* arcade upgrade-state chip on game footers */
.gc-foot .upg{color:var(--violet);text-shadow:0 0 6px var(--violet);}

/* ============================================================
   SUBPAGE: VOD ARCHIVE (vods.html)
============================================================ */
.page-pad{padding-top:150px;}
.filter-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:34px;}
.filter-tab{font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.1em;padding:10px 18px;color:#a8eaff;background:rgba(7,9,20,.6);border:1px solid rgba(0,255,245,.25);cursor:none;clip-path:polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));transition:color .2s,background .2s,box-shadow .2s;}
.filter-tab:hover{color:#000;background:var(--cyan);}
.filter-tab.active{color:#000;background:var(--violet);box-shadow:0 0 22px rgba(176,107,255,.5);}
.archive-count{font-family:var(--font-mono);font-size:12px;color:var(--yellow);letter-spacing:.1em;margin-bottom:18px;text-shadow:0 0 6px var(--yellow);}

/* ============================================================
   SUBPAGE: IMPRESSUM (impressum.html)
============================================================ */
.legal-wrap{max-width:760px;}
.legal-block{border:1px solid rgba(0,255,245,.18);background:linear-gradient(170deg,rgba(7,9,20,.9),rgba(2,3,10,.96));clip-path:polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px));padding:34px 38px;margin-bottom:24px;}
.legal-block h3{font-family:var(--font-display);font-weight:700;font-size:16px;letter-spacing:.06em;color:var(--violet);margin-bottom:14px;text-shadow:0 0 10px rgba(176,107,255,.35);}
.legal-block p{font-family:var(--font-body);font-size:16px;line-height:1.7;color:#c3d4e0;margin-bottom:10px;}
.legal-block p .mono{font-family:var(--font-mono);font-size:14px;color:var(--cyan);}
.legal-block a{color:var(--cyan);text-decoration:none;}
.legal-block a:hover{color:var(--yellow);}
.back-link{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.12em;color:var(--cyan);text-decoration:none;border-bottom:2px solid var(--cyan);padding-bottom:4px;margin-bottom:30px;cursor:none;transition:color .2s,border-color .2s;}
.back-link:hover{color:var(--yellow);border-color:var(--yellow);}

/* ============================================================
   CLIP VAULT (Clips — SOON™)
============================================================ */
.soon-panel{position:relative;border:1px solid rgba(255,42,138,.32);background:linear-gradient(160deg,rgba(20,4,30,.9),rgba(2,3,10,.96));clip-path:polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));padding:54px 40px;text-align:center;margin-bottom:34px;overflow:hidden;}
.soon-panel::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 38px,rgba(0,255,245,.04) 38px 40px);pointer-events:none;}
.soon-big{font-family:var(--font-display);font-weight:900;font-size:clamp(50px,10vw,120px);letter-spacing:.04em;color:#fff;line-height:1;position:relative;display:inline-block;}
.soon-sub{font-family:var(--font-mono);font-size:13px;letter-spacing:.22em;color:var(--cyan);margin-top:16px;text-shadow:0 0 6px rgba(0,255,245,.4);}
.soon-bar{height:6px;max-width:380px;margin:28px auto 0;background:rgba(0,255,245,.1);overflow:hidden;position:relative;border:1px solid rgba(0,255,245,.2);}
.soon-bar::after{content:'';position:absolute;top:0;height:100%;width:42%;left:-42%;background:linear-gradient(90deg,var(--cyan),var(--magenta));box-shadow:0 0 14px var(--cyan);animation:soonload 2.6s ease-in-out infinite;}
@keyframes soonload{0%{left:-42%;}100%{left:100%;}}
.clip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;}
.clip-locked{position:relative;border:1px dashed rgba(0,255,245,.3);background:var(--bg-2);aspect-ratio:16/9;clip-path:polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;overflow:hidden;}
.clip-locked .scanbar{position:absolute;left:0;right:0;top:-2px;height:2px;background:rgba(0,255,245,.45);box-shadow:0 0 12px var(--cyan);animation:clipscan 3s linear infinite;}
.clip-locked:nth-child(2) .scanbar{animation-delay:1s;}
.clip-locked:nth-child(3) .scanbar{animation-delay:2s;}
@keyframes clipscan{0%{top:-2px;}100%{top:100%;}}
.clip-locked .lock{font-size:32px;filter:drop-shadow(0 0 8px var(--violet));}
.clip-locked .ltxt{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;color:#7e92a3;}
.clip-locked .soon-tag{font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.2em;color:var(--yellow);text-shadow:0 0 6px var(--yellow);}

/* ============================================================
   DASH — Geometry-Dash style game (full width, levels)
============================================================ */
.dash-console{position:relative;border:1px solid rgba(176,107,255,.3);background:linear-gradient(170deg,rgba(10,4,22,.96),rgba(2,3,10,.98));clip-path:polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, 24px 100%, 0 calc(100% - 24px));box-shadow:0 0 44px rgba(176,107,255,.14);overflow:hidden;margin-bottom:30px;}
.dash-screen{position:relative;width:100%;aspect-ratio:24/9;background:#03040c;min-height:200px;}
.dash-screen canvas{position:absolute;inset:0;width:100%;height:100%;display:block;}
.level-select{display:flex;flex-wrap:wrap;gap:10px;padding:16px 18px;border-top:1px solid rgba(0,255,245,.12);background:rgba(0,255,245,.03);}
.level-chip{font-family:var(--font-display);font-weight:700;letter-spacing:.06em;padding:9px 14px;color:#a8eaff;background:rgba(7,9,20,.7);border:1px solid rgba(0,255,245,.25);cursor:none;clip-path:polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 9px 100%, 0 calc(100% - 9px));transition:border-color .2s,background .2s,box-shadow .2s;display:flex;flex-direction:column;gap:3px;align-items:flex-start;min-width:118px;}
.level-chip .lc-name{font-size:12px;color:#fff;}
.level-chip .lc-meta{font-family:var(--font-mono);font-weight:400;font-size:9px;color:var(--cyan);letter-spacing:.04em;}
.level-chip:hover:not(.locked){border-color:var(--violet);box-shadow:0 0 18px rgba(176,107,255,.25);}
.level-chip.active{background:var(--violet);border-color:var(--violet);box-shadow:0 0 22px rgba(176,107,255,.55);}
.level-chip.active .lc-name,.level-chip.active .lc-meta{color:#0a0014;}
.level-chip.locked{opacity:.45;cursor:not-allowed;border-style:dashed;}
.level-chip.locked .lc-meta{color:#7e92a3;}
.dash-foot{padding:12px 18px;font-family:var(--font-mono);font-size:11px;color:#7e92a3;letter-spacing:.05em;border-top:1px solid rgba(0,255,245,.12);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;}
.dash-foot b{color:var(--yellow);text-shadow:0 0 6px var(--yellow);}
.dash-foot .upg{color:var(--violet);text-shadow:0 0 6px var(--violet);}

/* shop: section label inside grid for grouping */
.shop-cat{grid-column:1/-1;font-family:var(--font-mono);font-size:11px;letter-spacing:.22em;color:var(--yellow);text-shadow:0 0 6px var(--yellow);padding:6px 2px 0;margin-top:6px;}
.shop-cat:first-child{margin-top:0;}
.shop-item .si-locked{font-family:var(--font-mono);font-size:10px;color:var(--magenta);letter-spacing:.06em;margin-top:4px;}

/* ============================================================
   SHOP — collapsible + leveled items
============================================================ */
.shop-toggle{background:rgba(0,255,245,.06);border:1px solid rgba(0,255,245,.4);color:var(--cyan);font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;padding:7px 14px;cursor:none;clip-path:polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px));transition:background .2s,color .2s;}
.shop-toggle:hover{background:var(--cyan);color:#000;}
.shop-panel.collapsed .shop-grid,.shop-panel.collapsed .shop-note{display:none;}
.shop-head .sh-right{display:flex;align-items:center;gap:16px;flex-wrap:wrap;}
.shop-item .si-pips{display:flex;gap:3px;margin-top:6px;}
.shop-item .si-pip{width:16px;height:5px;background:rgba(0,255,245,.18);}
.shop-item .si-pip.on{background:var(--cyan);box-shadow:0 0 6px var(--cyan);}
.shop-item.maxed{border-color:var(--yellow);}
.shop-item .si-buy.is-max{background:var(--yellow);color:#1a1700;box-shadow:0 0 14px rgba(255,242,0,.4);cursor:default;}

/* ============================================================
   STOCK CRASH
============================================================ */
.bet-row{display:flex;gap:8px;align-items:center;justify-content:center;margin:8px 0 2px;flex-wrap:wrap;}
.bet-label{font-family:var(--font-mono);font-size:11px;color:#9fb4c4;letter-spacing:.12em;}
.bet-chip{font-family:var(--font-display);font-weight:700;font-size:12px;padding:7px 13px;color:#a8eaff;background:rgba(7,9,20,.7);border:1px solid rgba(0,255,245,.3);cursor:none;clip-path:polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 7px 100%, 0 calc(100% - 7px));transition:background .2s,color .2s,box-shadow .2s;}
.bet-chip:hover{border-color:var(--violet);}
.bet-chip.sel{background:var(--cyan);color:#000;box-shadow:0 0 14px var(--cyan);}

/* ============================================================
   MINESWEEPER
============================================================ */
.mine-wrap{position:absolute;inset:0;display:flex;flex-direction:column;padding:9px;gap:8px;background:#06030f;}
.mine-topbar{display:flex;justify-content:space-between;align-items:center;font-family:var(--font-mono);font-size:12px;color:var(--cyan);gap:8px;}
.mine-topbar b{color:var(--yellow);}
.mine-btn{font-family:var(--font-display);font-weight:700;font-size:11px;letter-spacing:.06em;padding:6px 11px;color:#000;background:var(--cyan);border:none;cursor:none;clip-path:polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 7px 100%, 0 calc(100% - 7px));box-shadow:0 0 12px rgba(0,255,245,.35);transition:transform .12s,background .2s;}
.mine-btn:hover{transform:translateY(-1px);}
.mine-btn.flagmode{background:var(--yellow);box-shadow:0 0 12px rgba(255,242,0,.4);}
.mine-btn.hint{background:var(--violet);color:#fff;box-shadow:0 0 12px rgba(176,107,255,.4);}
.mine-grid{flex:1 1 0;min-height:0;align-self:center;aspect-ratio:1;max-width:100%;max-height:100%;display:grid;gap:3px;}
.mine-cell{background:linear-gradient(150deg,#12213b,#0a1426);border:1px solid rgba(0,255,245,.16);cursor:none;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:900;font-size:clamp(11px,2.4vw,16px);color:#fff;border-radius:3px;user-select:none;transition:background .08s;}
.mine-cell:hover{background:linear-gradient(150deg,#1a2c4a,#0e1a30);}
.mine-cell.rev{background:#070f1d;border-color:rgba(255,255,255,.05);cursor:default;}
.mine-cell.flag{background:linear-gradient(150deg,#3a2a10,#1f1606);}
.mine-cell.boom{background:var(--magenta);box-shadow:0 0 14px var(--magenta);}
.mine-cell.safe{background:#0a2a1a;}
.mine-cell.n1{color:#36c5ff}.mine-cell.n2{color:#00ff95}.mine-cell.n3{color:#fff200}.mine-cell.n4{color:#ff7ad9}.mine-cell.n5{color:#ff8a3d}.mine-cell.n6{color:#00fff5}.mine-cell.n7{color:#ff5a5a}.mine-cell.n8{color:#fff}

/* active game highlight (space focus) */
.game-console.active-game,.dash-console.active-game{border-color:var(--yellow);box-shadow:0 0 30px rgba(255,242,0,.18);}
.game-console.active-game .gc-head,.dash-console.active-game .gc-head{background:rgba(255,242,0,.05);}

/* ---- balance shown in each game footer ---- */
.live-bytes{color:var(--yellow);text-shadow:0 0 6px rgba(255,242,0,.6);font-weight:700;letter-spacing:.06em;white-space:nowrap;}
.gc-foot{gap:10px;}

/* ---- bunnyland icon replacing the fox emoji ---- */
.ac-top .bunny-emote img{width:120px;height:120px;object-fit:contain;display:block;}
.vod-thumb .vbunny img{width:96px;height:96px;object-fit:contain;display:block;}
.shop-head .sh-title .fx{display:inline-flex;width:26px;height:26px;align-items:center;justify-content:center;}
.shop-head .sh-title .fx img{width:26px;height:26px;object-fit:contain;border-radius:50%;display:block;}

/* ---- Bunny Dash pause button (in header) ---- */
.dash-console .gc-head{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid rgba(176,107,255,.22);background:rgba(176,107,255,.05);}
.dash-console .gc-head-right{display:flex;align-items:center;gap:12px;}
.dash-pause{display:none;align-items:center;gap:5px;font-family:var(--font-display);font-weight:700;font-size:10px;letter-spacing:.1em;padding:6px 12px;color:#02030a;background:var(--cyan);border:none;cursor:none;clip-path:polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 7px 100%, 0 calc(100% - 7px));box-shadow:0 0 12px rgba(0,255,245,.45);transition:transform .12s,background .2s;}
.dash-pause:hover{transform:translateY(-1px);background:#fff;}

/* ---- FrostiTV Twitch embed in hero card ---- */
.ac-top .tv-embed{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}
.ac-live{pointer-events:none;}

/* ---- Stock Crash: toggleable Auto-Sell ---- */
.auto-row{display:none;justify-content:center;margin:6px 0 2px;}
.auto-toggle{font-family:var(--font-display);font-weight:700;font-size:11px;letter-spacing:.06em;padding:7px 14px;color:#a8eaff;background:rgba(7,9,20,.7);border:1px solid rgba(0,255,245,.35);cursor:none;clip-path:polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 7px 100%, 0 calc(100% - 7px));transition:background .2s,color .2s,box-shadow .2s;}
.auto-toggle.on{background:var(--cyan);color:#02030a;box-shadow:0 0 14px rgba(0,255,245,.4);}
.auto-toggle.off{border-color:rgba(255,42,138,.5);color:#ff9ec6;}

/* ---- live YouTube thumbnails in VOD cards ---- */
.vod-thumb .ytthumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#0a0a14;}
.vod-thumb .ytthumb.failed{display:none;}
.vod-card.is-yt .vod-thumb{background:#0a0a14;}
.vod-card.is-yt .gname{max-width:78%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* ---- in-site VOD player modal ---- */
.vod-modal{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:24px;}
.vod-modal.hidden{display:none;}
.vod-modal .vm-backdrop{position:absolute;inset:0;background:rgba(2,3,10,.82);backdrop-filter:blur(6px);}
.vod-modal .vm-box{position:relative;z-index:1;width:min(860px,100%);max-height:92vh;overflow:auto;background:linear-gradient(170deg,rgba(10,4,22,.98),rgba(2,3,10,.99));border:1px solid rgba(176,107,255,.45);clip-path:polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));box-shadow:0 0 60px rgba(176,107,255,.25);}
.vod-modal .vm-close{position:absolute;top:10px;right:12px;z-index:3;width:34px;height:34px;border:1px solid rgba(0,255,245,.5);background:rgba(2,3,10,.7);color:var(--cyan);font-size:15px;cursor:none;clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,7px 100%,0 calc(100% - 7px));transition:background .2s,color .2s;}
.vod-modal .vm-close:hover{background:var(--cyan);color:#02030a;}
.vod-modal .vm-player{position:relative;aspect-ratio:16/9;background:#000;border-bottom:1px solid rgba(0,255,245,.2);}
.vod-modal .vm-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.vod-modal .vm-meta{padding:20px 24px 24px;}
.vod-modal .vm-title{font-family:var(--font-display);font-weight:900;font-size:19px;line-height:1.3;color:#fff;letter-spacing:.02em;margin-bottom:10px;}
.vod-modal .vm-sub{display:flex;flex-wrap:wrap;gap:8px 16px;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;margin-bottom:14px;}
.vod-modal .vm-sub .vm-cat{color:var(--cyan);text-shadow:0 0 6px rgba(0,255,245,.5);}
.vod-modal .vm-sub .vm-date{color:#9fb4c4;}
.vod-modal .vm-sub .vm-views{color:var(--violet);text-shadow:0 0 6px rgba(176,107,255,.5);}
.vod-modal .vm-desc{font-family:var(--font-mono);font-size:13px;line-height:1.6;color:#c2d2de;white-space:pre-wrap;max-height:230px;overflow:auto;margin-bottom:18px;padding-right:6px;}
.vod-modal .vm-open{display:inline-block;font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.08em;color:#02030a;background:var(--cyan);text-decoration:none;padding:11px 20px;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));box-shadow:0 0 16px rgba(0,255,245,.4);}

/* ---- "older VODs -> YouTube channel" banner (below archive grid) ---- */
.vod-banner{display:flex;align-items:center;gap:18px;margin-top:30px;padding:22px 26px;text-decoration:none;cursor:none;
  background:linear-gradient(100deg,rgba(176,107,255,.16),rgba(0,255,245,.08));border:1px solid rgba(176,107,255,.5);
  clip-path:polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px));
  transition:transform .25s, box-shadow .25s, border-color .25s;}
.vod-banner:hover{transform:translateY(-3px);border-color:var(--cyan);box-shadow:0 0 34px rgba(0,255,245,.28);}
.vod-banner .vb-play{flex:0 0 auto;width:48px;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid var(--cyan);border-radius:50%;box-shadow:0 0 18px rgba(0,255,245,.45);}
.vod-banner .vb-tri{width:0;height:0;border-left:15px solid var(--cyan);border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:4px;filter:drop-shadow(0 0 4px var(--cyan));}
.vod-banner .vb-text{flex:1 1 auto;display:flex;flex-direction:column;gap:4px;}
.vod-banner .vb-text strong{font-family:var(--font-display);font-weight:900;font-size:17px;color:#fff;letter-spacing:.02em;}
.vod-banner .vb-sub{font-family:var(--font-mono);font-size:13px;letter-spacing:.05em;color:var(--cyan);}
.vod-banner .vb-arrow{flex:0 0 auto;font-family:var(--font-display);font-weight:900;font-size:22px;color:var(--violet);text-shadow:0 0 10px rgba(176,107,255,.6);transition:transform .25s;}
.vod-banner:hover .vb-arrow{transform:translate(3px,-3px);}
@media(max-width:560px){.vod-banner{gap:14px;padding:18px;}.vod-banner .vb-text strong{font-size:15px;}.vod-banner .vb-sub{font-size:12px;}}

/* ---- hide view counts on all VOD cards (index + vods) ---- */
.vod-info .views{display:none;}
.vod-info{justify-content:flex-start;}

/* ---- footer link to main site ---- */
.foot-main{display:inline-block;margin:0 0 22px;font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.08em;color:var(--cyan);text-decoration:none;padding:9px 18px;border:1px solid rgba(0,255,245,.45);clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,9px 100%,0 calc(100% - 9px));transition:background .2s,color .2s,box-shadow .2s;}
.foot-main:hover{background:var(--cyan);color:#02030a;box-shadow:0 0 20px rgba(0,255,245,.45);}

/* ============================================================
   MOBILE — hamburger nav + responsive structure
============================================================ */
.nav-toggle{display:none;}

@media (max-width:768px){
  /* slim top status bar */
  .hud-top{padding:12px 14px;font-size:9px;letter-spacing:.12em;}
  .hud-top .right{display:none;}
  .hud-top .left{gap:12px;}

  /* hamburger toggle button */
  .nav-toggle{
    display:flex;align-items:center;justify-content:center;pointer-events:auto;
    position:fixed;top:10px;right:12px;z-index:60;width:48px;height:44px;
    font-size:20px;line-height:1;color:var(--cyan);background:rgba(2,3,10,.9);
    border:1px solid rgba(0,255,245,.45);cursor:none;
    clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
    box-shadow:0 0 16px rgba(0,255,245,.3);transition:background .2s,color .2s;
  }
  .cyber-nav.open .nav-toggle{background:var(--cyan);color:#02030a;}

  /* nav becomes a tap-friendly dropdown */
  nav.cyber-nav{top:0;justify-content:flex-end;}
  nav.cyber-nav ul{
    display:none;position:fixed;top:62px;left:12px;right:12px;
    flex-direction:column;gap:2px;padding:8px;max-height:76vh;overflow:auto;
  }
  nav.cyber-nav.open ul{display:flex;}
  nav.cyber-nav a{padding:14px 16px;font-size:13px;text-align:center;letter-spacing:.14em;border-bottom:1px solid rgba(0,255,245,.08);}
  nav.cyber-nav li:last-child a{border-bottom:none;}
  nav.cyber-nav a::before{clip-path:none;}

  /* hero: don't force full viewport height, tighten spacing */
  .hero{min-height:auto;padding:96px 20px 56px;gap:30px;}
  .hero-tag{font-size:10px;letter-spacing:.25em;margin-bottom:16px;}
  .archive-card .ac-top{height:200px;}

  section{padding:56px 20px;}
  footer{padding:48px 20px 36px;}

  /* CTAs full width = bigger tap targets */
  .cta-row{flex-direction:column;gap:12px;}
  .cta-row .btn-cyber{width:100%;text-align:center;}

  /* single-/double-column grids */
  .vod-grid{grid-template-columns:1fr;}
  .arcade-grid{grid-template-columns:1fr;gap:22px;}
  .shop-grid{grid-template-columns:1fr 1fr;}
  .clip-grid{grid-template-columns:1fr 1fr;}

  /* modal player a touch tighter */
  .vod-modal{padding:14px;}
  .vod-modal .vm-meta{padding:16px 16px 18px;}
}

@media (max-width:480px){
  section{padding:48px 16px;}
  .hero{padding:90px 16px 48px;}
  .shop-grid{grid-template-columns:1fr;}
  .clip-grid{grid-template-columns:1fr;}
  .hud-top .left .item:nth-child(3){display:none;}
  .foot-bottom{flex-direction:column;align-items:flex-start;gap:8px;}
}