:root{--bg:#080014;--panel:#16002b;--acid:#8dff00;--hot:#ff51a2;--cyan:#00e5ff;--yellow:#fff36d;--text:#f8f2ff;--muted:#cbb9ff;--border-light:#fff;--border-dark:#2c0048;--max:980px;--font:Verdana,Geneva,Tahoma,sans-serif;--mono:"Courier New",Courier,monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;font-family:var(--font);color:var(--text);background-color:var(--bg);background-image:radial-gradient(circle at 10px 10px,rgba(255,255,255,.2) 1px,transparent 2px),radial-gradient(circle at 60px 30px,rgba(0,229,255,.24) 1px,transparent 2px),linear-gradient(45deg,rgba(255,81,162,.11) 25%,transparent 25%,transparent 75%,rgba(255,81,162,.11) 75%),linear-gradient(45deg,rgba(0,229,255,.08) 25%,transparent 25%,transparent 75%,rgba(0,229,255,.08) 75%);background-size:90px 90px,120px 120px,32px 32px,32px 32px;background-position:0 0,0 0,0 0,16px 16px;cursor:crosshair}a{color:var(--yellow);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}a:hover{color:#fff;background:var(--hot);text-decoration:none}img{max-width:100%;height:auto;display:block}code{color:var(--acid);font-family:var(--mono)}::selection{color:#000;background:var(--acid)}.page-shell{width:min(var(--max),calc(100% - 22px));margin:18px auto 36px;border:4px ridge var(--cyan);background:rgba(8,0,20,.92);box-shadow:0 0 0 4px #000,0 0 30px rgba(0,229,255,.45),12px 12px 0 rgba(255,81,162,.28)}.top-strip{display:flex;justify-content:space-between;gap:12px;padding:4px 8px;color:#000;background:linear-gradient(90deg,var(--acid),var(--cyan),var(--hot));font:700 11px var(--mono);letter-spacing:.04em;text-transform:uppercase;border-bottom:3px double #000}.site-header{position:relative;min-height:190px;padding:18px 18px 14px;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.18),transparent 16%),radial-gradient(circle at 78% 35%,rgba(141,255,0,.28),transparent 18%),linear-gradient(135deg,#380070 0%,#080014 38%,#12003a 62%,#4b005f 100%);overflow:hidden;border-bottom:4px groove var(--hot)}.site-header:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:18px 18px;pointer-events:none;mix-blend-mode:screen}.hero-grid{position:relative;display:grid;grid-template-columns:150px 1fr 150px;gap:16px;align-items:center;z-index:1}.avatar-frame,.badge-stack{border:3px outset var(--border-light);background:#000;padding:7px;min-height:132px;display:grid;place-items:center;text-align:center;box-shadow:inset 0 0 0 2px var(--border-dark),0 0 18px rgba(255,81,162,.35)}.pixel-face{width:104px;height:104px;image-rendering:pixelated;border:2px solid var(--acid);background:linear-gradient(90deg,transparent 46%,#000 46% 54%,transparent 54%),linear-gradient(#ffdfb8 0 64%,#1e103d 64% 100%);position:relative}.pixel-face:before,.pixel-face:after{content:"";position:absolute;top:38px;width:11px;height:11px;background:#000;box-shadow:0 0 0 3px #fff inset}.pixel-face:before{left:27px}.pixel-face:after{right:27px}.hero-copy h1{margin:0;font-size:clamp(34px,7vw,72px);line-height:.88;letter-spacing:-.08em;color:#fff;text-shadow:3px 3px 0 #000,6px 6px 0 var(--hot),-3px -3px 0 var(--cyan);font-family:Impact,Haettenschweiler,"Arial Narrow Bold",sans-serif;text-transform:uppercase}.hero-copy p{max-width:600px;margin:13px 0 0;font-size:14px;line-height:1.55;color:var(--muted);background:rgba(0,0,0,.52);border:1px dotted var(--cyan);padding:8px 10px}.badge-stack{align-content:center;gap:8px;font:700 10px var(--mono);text-transform:uppercase}.button-88x31{display:inline-grid;place-items:center;width:88px;min-height:31px;color:#000;background:linear-gradient(#fff,var(--cyan) 45%,#004e68 46%,var(--acid));border:2px outset #fff;font:900 10px Arial,sans-serif;text-decoration:none;text-align:center;line-height:1;box-shadow:2px 2px 0 #000;padding:2px}.button-88x31.long-badge{height:auto;min-height:44px;font-size:8px;line-height:1.05}.blink{animation:blink 1s steps(2,start) infinite}@keyframes blink{50%{opacity:.15}}.ticker{background:#000;border-top:2px solid #53008c;border-bottom:2px solid var(--cyan);color:var(--acid);font:700 12px var(--mono);text-transform:uppercase;padding:5px 0}.layout{display:grid;grid-template-columns:190px 1fr 190px;gap:10px;padding:10px}.panel{min-width:0;overflow:hidden;border-width:3px;border-style:solid;border-color:var(--border-light) var(--border-dark) var(--border-dark) var(--border-light);background:linear-gradient(180deg,var(--panel) 0%,#080014 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),4px 4px 0 rgba(0,0,0,.75);margin-bottom:10px}.panel-title{margin:0;padding:6px 8px;color:#000;background:linear-gradient(90deg,var(--yellow),var(--hot));border-bottom:2px solid #000;font:900 12px var(--mono);text-transform:uppercase;letter-spacing:.04em}.panel-body{min-width:0;overflow:hidden;padding:9px;font-size:12px;line-height:1.5}.nav-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}.nav-list a{display:block;padding:7px 8px;background:linear-gradient(90deg,#000,#2a005a);border:2px outset #7c67ff;color:#fff;font:700 12px var(--mono);text-decoration:none}.nav-list a:before{content:"» ";color:var(--acid)}.nav-list a:hover{background:var(--hot);color:#000}.main-content{min-width:0}.content-block{margin-bottom:12px;border:2px dashed rgba(0,229,255,.7);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02)),rgba(35,0,70,.72);padding:12px}.content-block h2{margin:0 0 8px;color:var(--yellow);font-size:22px;letter-spacing:-.04em;text-shadow:2px 2px 0 #000}.content-block h3{margin:0 0 6px;color:var(--cyan);font-size:15px;text-transform:uppercase;font-family:var(--mono)}.content-block p{margin:0 0 10px;font-size:13px;line-height:1.65}.two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card{border:2px groove var(--cyan);background:rgba(0,0,0,.46);padding:10px;min-height:120px}.card strong{display:block;margin-bottom:5px;color:var(--acid);font-family:var(--mono);text-transform:uppercase}.gallery-toolbar{display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin:10px 0}.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.gallery-card{border:2px outset #b7a8ff;background:linear-gradient(180deg,#2b0052,#07000f);padding:7px}.gallery-image-wrap{background:#000;border:1px solid var(--hot);min-height:145px;display:grid;place-items:center;overflow:hidden}.gallery-card img{width:100%;aspect-ratio:4/3;object-fit:cover}.gallery-caption{margin:7px 0 0;color:var(--muted);font:12px/1.45 var(--mono)}.gallery-loading{border:1px dotted var(--yellow);background:rgba(255,255,255,.05);padding:12px;color:var(--muted);grid-column:1/-1}.winamp-radio{max-width:610px;margin:0 auto 10px;border:3px solid #151522;background:#2d2b49;box-shadow:0 0 0 2px #6c6a8e inset,4px 4px 0 #090912,0 0 22px rgba(0,0,0,.6);color:#cdd8d8;font-family:var(--mono)}.winamp-titlebar{height:24px;display:flex;align-items:center;gap:7px;padding:3px 7px;color:#fff;background:linear-gradient(180deg,#171729,#39375e);border-bottom:2px solid #0b0b15;font:900 13px var(--mono);letter-spacing:.05em;text-transform:uppercase}.tiny-light{width:13px;height:13px;display:inline-block;background:linear-gradient(90deg,transparent 45%,#f4d16c 45% 60%,transparent 60%),linear-gradient(#f4d16c 45%,transparent 45% 60%,#f4d16c 60%);filter:drop-shadow(0 0 2px #f4d16c)}.winamp-title{flex:1;text-shadow:2px 2px 0 #000}.winamp-window-buttons{display:flex;gap:4px}.winamp-window-buttons span{width:13px;height:11px;background:linear-gradient(#e7f3ff,#8fa4b4);border:2px outset #d7e7ef}.winamp-main{display:grid;grid-template-columns:195px 1fr;gap:10px;padding:10px 10px 6px}.winamp-visual{background:#070712;border:3px inset #6c6a8e;padding:5px;min-height:112px;position:relative}.timer{position:absolute;right:8px;top:5px;color:#2dff2d;font:900 27px var(--mono);letter-spacing:-.12em;text-shadow:0 0 4px rgba(45,255,45,.85);z-index:2}#visualizer{display:block;width:100%;height:88px;image-rendering:pixelated;margin-top:14px}.winamp-display{min-width:0;position:relative}.track-screen{height:33px;display:flex;align-items:center;overflow:hidden;padding:4px 8px;background:#05060a;border:3px inset #6c6a8e;color:#2dff2d;font:900 17px var(--mono);text-shadow:0 0 4px rgba(45,255,45,.8);white-space:nowrap}#trackTitle{display:inline-block;min-width:100%;animation:titleMarquee 12s linear infinite}@keyframes titleMarquee{0%,14%{transform:translateX(0)}100%{transform:translateX(-55%)}}.meta-row{display:flex;flex-wrap:wrap;gap:10px;margin:9px 0 8px;color:#d6dbe8;font:900 13px var(--mono)}.meta-row span:first-child,.meta-row span:nth-child(2){color:#2dff2d;background:#0b0d10;padding:2px 5px}#radioState{color:#2dff2d;margin-left:auto}.winamp-controls{display:grid;grid-template-columns:46px 46px 46px 1fr;gap:8px;align-items:center;padding:8px 10px 12px;border-top:3px solid #171729}.transport-button{width:46px;height:36px;display:grid;place-items:center;color:#49606d;background:linear-gradient(#f8ffff,#9eb5c6);border:4px outset #dcebf2;cursor:pointer;text-shadow:1px 1px 0 #fff;padding:0}.transport-button:active,.transport-button.is-active{border-style:inset}.icon{display:block;position:relative;width:18px;height:18px}.icon-play{width:0;height:0;border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:16px solid #49606d;transform:translateX(2px)}.icon-pause:before,.icon-pause:after{content:"";position:absolute;top:1px;width:6px;height:17px;background:#49606d}.icon-pause:before{left:2px}.icon-pause:after{right:2px}.icon-stop{width:17px;height:17px;background:#49606d}.radio-caption{color:#d8e2f2;font:700 11px/1.35 var(--mono)}.status-light{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--acid);box-shadow:0 0 8px var(--acid);margin-right:5px}.mini-list{margin:0;padding-left:18px}.mini-list li{margin-bottom:4px}.counter{display:inline-block;max-width:100%;min-width:0;padding:4px 7px;background:#000;border:2px inset #999;color:var(--acid);font:700 13px var(--mono);letter-spacing:.08em;text-align:center;overflow-wrap:anywhere}#realCounterMount{display:block;width:100%;max-width:100%;min-height:38px;max-height:72px;overflow:hidden}#realCounterMount iframe,#realCounterMount object,#realCounterMount embed,#realCounterMount div{max-width:100%!important;width:100%!important;min-width:0!important;box-sizing:border-box!important;overflow:hidden!important}#realCounterMount iframe{height:64px!important;border:0!important}#realCounterMount div{border:2px inset #999!important;background:#000!important;color:var(--acid)!important;font-family:"Courier New",Courier,monospace!important;font-size:11px!important;padding:5px!important;text-align:center!important;letter-spacing:0!important}.guestbook-form label{display:block;margin-bottom:6px;color:var(--cyan);font:700 12px var(--mono)}input,textarea,button{font:12px var(--mono)}input,textarea{width:100%;color:#fff;background:#000;border:2px inset #bfbfbf;padding:7px;margin-bottom:8px}textarea{min-height:82px;resize:vertical}button,.fake-button{display:inline-block;color:#000;background:linear-gradient(#fff,#bfbfbf);border:3px outset #e6e6e6;padding:6px 10px;font-weight:700;cursor:pointer;text-decoration:none}button:active,.fake-button:active{border-style:inset}.form-status{color:var(--acid);margin-left:8px;font:700 11px var(--mono)}.honey{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}.guestbook-entries{margin-top:10px;display:grid;gap:6px}.guestbook-entry{border:1px dotted var(--yellow);padding:7px;background:rgba(255,255,255,.05);word-break:break-word}.guestbook-entry strong{color:var(--acid)}.footer{padding:12px;border-top:4px groove var(--hot);background:#000;text-align:center;color:var(--muted);font:11px var(--mono)}.webring{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:10px}.webring a{padding:4px 7px;border:1px solid var(--cyan);background:#140027}.sticker-wall{display:flex;flex-wrap:wrap;gap:5px}.sticker{display:inline-block;padding:3px 5px;color:#000;background:var(--acid);border:2px outset #fff;font:900 10px Arial,sans-serif;transform:rotate(-2deg)}.sticker:nth-child(2n){background:var(--cyan);transform:rotate(2deg)}.sticker:nth-child(3n){background:var(--hot);color:#fff;transform:rotate(-4deg)}.small-note{color:var(--muted);font-size:11px;line-height:1.45}@media(max-width:860px){.hero-grid,.layout{grid-template-columns:1fr}.hero-grid{text-align:center}.avatar-frame,.badge-stack{min-height:auto}.layout{padding:8px}.side-left{order:1}.main-content{order:2}.side-right{order:3}.two-col,.gallery-grid{grid-template-columns:1fr}.winamp-main{grid-template-columns:1fr}.winamp-controls{grid-template-columns:46px 46px 46px}.radio-caption{grid-column:1/-1}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}


/* V4 RADIO HISTORY OVERRIDES */

.winamp-controls.compact-controls {
  display: grid !important;
  grid-template-columns: 42px 42px 42px 42px 42px minmax(0, 1fr) !important;
  gap: 7px !important;
  align-items: center !important;
  padding: 8px 10px 12px !important;
  border-top: 3px solid #171729 !important;
}

.transport-button {
  width: 42px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
}

.icon {
  display: block;
  position: relative;
  width: 18px;
  height: 18px;
}

.icon-prev:before,
.icon-prev:after,
.icon-next:before,
.icon-next:after {
  content: "";
  position: absolute;
  top: 0;
}

.icon-prev:before {
  left: 1px;
  width: 4px;
  height: 18px;
  background: #49606d;
}

.icon-prev:after {
  left: 6px;
  width: 0;
  height: 0;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-right: 14px solid #49606d;
}

.icon-next:before {
  right: 1px;
  width: 4px;
  height: 18px;
  background: #49606d;
}

.icon-next:after {
  right: 6px;
  width: 0;
  height: 0;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-left: 14px solid #49606d;
}

.icon-play {
  width: 0 !important;
  height: 0 !important;
  border-top: 10px solid transparent !important;
  border-bottom: 10px solid transparent !important;
  border-left: 16px solid #49606d !important;
  transform: translateX(2px) !important;
}

.icon-pause:before,
.icon-pause:after {
  content: "";
  position: absolute;
  top: 1px;
  width: 6px;
  height: 17px;
  background: #49606d;
}

.icon-pause:before { left: 2px; }
.icon-pause:after { right: 2px; }

.icon-stop {
  width: 17px !important;
  height: 17px !important;
  background: #49606d !important;
}

.played-history {
  margin: 0 10px 12px;
  border: 3px inset #6c6a8e;
  background: #05060a;
  padding: 7px;
  color: #cdd8d8;
  font-family: var(--mono);
}

.played-history-title {
  color: #2dff2d;
  font: 900 12px var(--mono);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 5px;
}

.played-history ol {
  margin: 0;
  padding-left: 21px;
  max-height: 92px;
  overflow: auto;
  scrollbar-color: #6c6a8e #05060a;
}

.played-history li {
  color: #d8e2f2;
  font-size: 11px;
  line-height: 1.45;
  margin-bottom: 3px;
}

.played-history li:first-child {
  color: var(--acid);
}

@media (max-width: 860px) {
  .winamp-controls.compact-controls {
    grid-template-columns: 42px 42px 42px 42px 42px !important;
  }

  .radio-caption {
    grid-column: 1 / -1;
  }
}


/* V5 STRUCTURE, AVATAR, DIARY, LINKS */

.avatar-gif {
  width: 104px;
  height: 104px;
  object-fit: cover;
  image-rendering: pixelated;
  border: 2px solid var(--acid);
  background: #000;
  box-shadow: 0 0 12px rgba(141, 255, 0, .45);
}

.button-88x31.long-badge {
  height: auto;
  min-height: 44px;
  font-size: 8px;
  line-height: 1.05;
}

.diary-list,
.links-list {
  display: grid;
  gap: 10px;
}

.diary-entry,
.link-entry {
  border: 2px groove var(--cyan);
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    rgba(0,0,0,.46);
  padding: 10px;
}

.diary-entry h3,
.link-entry h3 {
  margin: 0 0 5px;
  color: var(--acid);
  font: 900 15px var(--mono);
  text-transform: uppercase;
  letter-spacing: .02em;
}

.diary-date,
.link-meta {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font: 11px/1.4 var(--mono);
}

.diary-entry p,
.link-entry p {
  margin: 0;
  white-space: pre-wrap;
}

.link-entry a {
  display: inline-block;
  margin-bottom: 5px;
  color: var(--yellow);
  font: 900 14px var(--mono);
  word-break: break-word;
}

.admin-shell {
  width: min(760px, calc(100% - 22px));
  margin: 26px auto;
}

.admin-form {
  border: 3px ridge var(--cyan);
  background: rgba(8, 0, 20, .94);
  padding: 18px;
  box-shadow: 8px 8px 0 rgba(255,81,162,.28);
}

.admin-form h1 {
  margin-top: 0;
  color: var(--yellow);
  font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
  font-size: 42px;
  letter-spacing: -.04em;
  text-transform: uppercase;
  text-shadow: 2px 2px 0 #000, 4px 4px 0 var(--hot);
}

.admin-status {
  margin-top: 10px;
  color: var(--acid);
  font: 700 12px var(--mono);
}

#realCounterMount #gcvc-for {
  display: none !important;
}


/* V8 TOP SITES */

.top-sites-list {
  margin: 0;
  padding-left: 20px;
  display: grid;
  gap: 6px;
}

.top-sites-list li {
  color: var(--muted);
  font: 700 11px/1.35 var(--mono);
  word-break: break-word;
}

.top-sites-list a {
  color: var(--yellow);
  text-decoration: none;
}

.top-sites-list a:hover {
  color: #000;
  background: var(--acid);
}

.top-sites-category {
  display: block;
  color: var(--cyan);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  opacity: .9;
}


/* V9 LIST SCROLLING AND CHAT */

.guestbook-entries,
.links-list,
.diary-list {
  max-height: 520px;
  overflow: auto;
  padding-right: 6px;
  scrollbar-color: #6c6a8e #05060a;
}

.gallery-grid {
  max-height: 680px;
  overflow: auto;
  padding-right: 6px;
  scrollbar-color: #6c6a8e #05060a;
}

.chat-room {
  border: 3px ridge var(--cyan);
  background: rgba(0,0,0,.45);
  padding: 10px;
}

.chat-messages {
  height: 280px;
  overflow: auto;
  border: 3px inset #6c6a8e;
  background: #05060a;
  padding: 8px;
  margin-bottom: 10px;
  scrollbar-color: #6c6a8e #05060a;
}

.chat-message {
  border-bottom: 1px dotted rgba(255,255,255,.22);
  padding: 6px 0;
  color: #d8e2f2;
  font: 12px/1.45 var(--mono);
  word-break: break-word;
}

.chat-message:last-child {
  border-bottom: 0;
}

.chat-message strong {
  color: var(--acid);
}

.chat-time {
  color: var(--muted);
  font-size: 10px;
}

.chat-form {
  display: grid;
  gap: 6px;
}

.chat-form input {
  margin-bottom: 4px;
}


/* V10 MEDIA SESSION + TRACK LIKES */

.radio-like-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 9px;
  font-family: var(--mono);
}

.like-button {
  width: 34px;
  height: 28px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 3px outset #dcebf2;
  background: linear-gradient(#f8ffff, #9eb5c6);
  cursor: pointer;
}

.like-button:active {
  border-style: inset;
}

.like-button.is-liked {
  background: linear-gradient(#d7ffd1, #8dff00);
  animation: likePop .24s steps(2, end);
}

@keyframes likePop {
  0% { transform: scale(1); }
  50% { transform: scale(1.18) rotate(-4deg); }
  100% { transform: scale(1); }
}

.pixel-thumb {
  width: 18px;
  height: 18px;
  display: block;
  image-rendering: pixelated;
  background: #6d7884;
  box-shadow:
    4px 0 0 #6d7884,
    8px 0 0 #6d7884,
    4px 4px 0 #6d7884,
    8px 4px 0 #6d7884,
    12px 4px 0 #6d7884,
    4px 8px 0 #6d7884,
    8px 8px 0 #6d7884,
    12px 8px 0 #6d7884,
    4px 12px 0 #6d7884,
    8px 12px 0 #6d7884,
    -4px 8px 0 #6d7884,
    -4px 12px 0 #6d7884;
  transform: scale(.72) translate(-4px, -2px);
}

.like-button.is-liked .pixel-thumb {
  background: #157d00;
  box-shadow:
    4px 0 0 #157d00,
    8px 0 0 #157d00,
    4px 4px 0 #157d00,
    8px 4px 0 #157d00,
    12px 4px 0 #157d00,
    4px 8px 0 #157d00,
    8px 8px 0 #157d00,
    12px 8px 0 #157d00,
    4px 12px 0 #157d00,
    8px 12px 0 #157d00,
    -4px 8px 0 #157d00,
    -4px 12px 0 #157d00;
}

.like-count {
  color: #2dff2d;
  font: 900 12px var(--mono);
  text-shadow: 0 0 4px rgba(45,255,45,.8);
}


/* V11 FIXED LIKE BUTTON + IOS AUDIO MODE */

.radio-like-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 9px;
  font-family: var(--mono);
}

.like-button {
  width: 38px;
  height: 32px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 3px outset #dcebf2;
  background: linear-gradient(#f8ffff, #9eb5c6);
  cursor: pointer;
  color: #687684;
}

.like-button:active {
  border-style: inset;
}

.like-button.is-liked {
  color: #137d00;
  background: linear-gradient(#eaffdf, #8dff00);
  animation: likePop .26s steps(2, end);
}

.like-button.is-saving {
  opacity: .72;
}

@keyframes likePop {
  0% { transform: scale(1); }
  50% { transform: scale(1.16) rotate(-4deg); }
  100% { transform: scale(1); }
}

.pixel-thumb {
  width: 22px;
  height: 22px;
  image-rendering: pixelated;
  display: block;
  filter: drop-shadow(1px 1px 0 #fff);
}

.like-count {
  color: #2dff2d;
  font: 900 12px var(--mono);
  text-shadow: 0 0 4px rgba(45,255,45,.8);
}


/* V12 LIKE BUTTON FIX */

.radio-like-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 9px;
  font-family: var(--mono);
}

.like-button {
  width: 38px !important;
  height: 32px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 3px outset #dcebf2 !important;
  background: linear-gradient(#f8ffff, #9eb5c6) !important;
  cursor: pointer !important;
  color: #687684 !important;
  line-height: 1 !important;
}

.like-button:active {
  border-style: inset !important;
}

.like-button.is-liked {
  color: #157d00 !important;
  background: linear-gradient(#eaffdf, #8dff00) !important;
  animation: likePop .26s steps(2, end);
}

.like-button.is-saving {
  opacity: .72;
}

.like-symbol {
  display: block;
  font: 900 24px/1 "Courier New", Courier, monospace;
  transform: rotate(-90deg) translateY(-1px);
  text-shadow: 1px 1px 0 #fff;
  pointer-events: none;
}

.like-button.is-liked .like-symbol {
  text-shadow: 1px 1px 0 #b8ffae, 0 0 5px rgba(141,255,0,.75);
}

.like-count {
  color: #2dff2d !important;
  font: 900 12px var(--mono) !important;
  text-shadow: 0 0 4px rgba(45,255,45,.8) !important;
}

/* Kill the old CSS-shadow thumb in case cached/older markup is mixed with newer CSS. */
.pixel-thumb {
  background: none !important;
  box-shadow: none !important;
  filter: none !important;
}


/* V13 FINAL LIKE BUTTON */

.radio-like-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 9px;
  font-family: var(--mono);
}

.like-button {
  width: 40px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 3px outset #dcebf2 !important;
  background: linear-gradient(#f8ffff, #9eb5c6) !important;
  cursor: pointer !important;
  color: #65717f !important;
  line-height: 1 !important;
}

.like-button:active {
  border-style: inset !important;
}

.like-button.is-liked {
  color: #157d00 !important;
  background: linear-gradient(#eaffdf, #8dff00) !important;
  animation: likePop .26s steps(2, end);
}

.like-button.is-saving {
  opacity: .72;
}

@keyframes likePop {
  0% { transform: scale(1); }
  50% { transform: scale(1.16) rotate(-4deg); }
  100% { transform: scale(1); }
}

.thumb-pixel-icon {
  width: 23px;
  height: 23px;
  display: block;
  image-rendering: pixelated;
  filter: drop-shadow(1px 1px 0 #fff);
  pointer-events: none;
}

.like-button.is-liked .thumb-pixel-icon {
  filter: drop-shadow(1px 1px 0 #b8ffae) drop-shadow(0 0 4px rgba(141,255,0,.75));
}

.like-count {
  color: #2dff2d !important;
  font: 900 12px var(--mono) !important;
  text-shadow: 0 0 4px rgba(45,255,45,.8) !important;
}

/* Disable earlier experimental icon styles if cached markup/CSS overlap. */
.pixel-thumb,
.like-symbol {
  background: none !important;
  box-shadow: none !important;
  filter: none !important;
}


/* V14 LOCAL RETRO VISITOR COUNTER */

#realCounterMount {
  display: block;
  width: 100%;
  max-width: 100%;
  min-height: 38px;
  overflow: hidden;
}

#realCounterMount .counter {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 8px 7px;
  background: #000;
  border: 3px inset #999;
  color: var(--acid);
  font: 900 18px/1.1 "Courier New", Courier, monospace;
  letter-spacing: .14em;
  text-align: center;
  text-shadow: 0 0 4px rgba(141,255,0,.8);
  overflow-wrap: anywhere;
  box-sizing: border-box;
}

#counterSetupNote {
  display: none;
}


/* V15 LIGHTBOX + NEON M CURSOR */

/*
  Neon M cursor.
  This uses an inline SVG cursor so no separate cursor image is needed.
*/
html,
body,
a,
button,
input,
textarea,
select,
[role="button"] {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cfilter id='glow'%3E%3CfeGaussianBlur stdDeviation='1.2' result='blur'/%3E%3CfeMerge%3E%3CfeMergeNode in='blur'/%3E%3CfeMergeNode in='SourceGraphic'/%3E%3C/feMerge%3E%3C/filter%3E%3Crect width='32' height='32' fill='none'/%3E%3Ctext x='2' y='23' font-family='Arial Black,Arial,sans-serif' font-size='25' font-weight='900' fill='%238dff00' stroke='%2300e5ff' stroke-width='1.2' filter='url(%23glow)'%3EM%3C/text%3E%3C/svg%3E") 3 24, crosshair;
}

.gallery-card {
  cursor: inherit;
}

.gallery-image-wrap,
.gallery-image-wrap img {
  cursor: zoom-in !important;
}

.gallery-card button.gallery-open-button {
  all: unset;
  display: block;
  width: 100%;
  cursor: zoom-in !important;
}

.gallery-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
  background:
    radial-gradient(circle at center, rgba(0,229,255,.14), transparent 42%),
    rgba(0,0,0,.88);
}

.gallery-lightbox.is-open {
  display: flex;
}

.gallery-lightbox-inner {
  width: min(980px, 96vw);
  max-height: 92vh;
  border: 4px ridge var(--cyan);
  background: #05060a;
  box-shadow: 0 0 0 4px #000, 0 0 28px rgba(141,255,0,.45), 12px 12px 0 rgba(255,81,162,.25);
  padding: 10px;
  position: relative;
}

.gallery-lightbox img {
  width: 100%;
  max-height: 78vh;
  object-fit: contain;
  background: #000;
  border: 2px inset #6c6a8e;
}

.gallery-lightbox-caption {
  margin: 8px 42px 0 0;
  color: var(--muted);
  font: 12px/1.45 var(--mono);
}

.gallery-lightbox-close {
  position: absolute;
  right: 8px;
  top: 8px;
  width: 34px;
  height: 30px;
  display: grid;
  place-items: center;
  color: #000;
  background: linear-gradient(#fff, var(--hot));
  border: 3px outset #fff;
  font: 900 18px/1 var(--mono);
  cursor: pointer !important;
}

.gallery-lightbox-close:active {
  border-style: inset;
}

@media (max-width: 700px) {
  .gallery-lightbox {
    padding: 10px;
  }

  .gallery-lightbox-inner {
    width: 98vw;
    max-height: 94vh;
  }

  .gallery-lightbox img {
    max-height: 72vh;
  }
}


/* V16 MULTIROI SNAKE MODAL + PROMO */

.multiroi-snake-promo {
  border-color: var(--border-light) var(--border-dark) var(--border-dark) var(--border-light);
  background:
    radial-gradient(circle at 18% 12%, rgba(66, 247, 255, .18), transparent 34%),
    radial-gradient(circle at 84% 78%, rgba(255, 81, 162, .18), transparent 36%),
    #05000b;
  box-shadow:
    inset 0 0 18px rgba(255, 81, 162, .15),
    0 0 12px rgba(66, 247, 255, .45),
    4px 4px 0 rgba(0,0,0,.75);
}

.multiroi-snake-promo .panel-title {
  color: #000;
  background: linear-gradient(90deg, var(--acid), var(--cyan), var(--hot));
  text-shadow: none;
}

.multiroi-snake-promo .panel-body p {
  font-size: 12px;
  line-height: 1.35;
}

.snake-launch-button {
  width: 100%;
  padding: 8px 10px;
  border: 3px outset #ff51a2;
  background: linear-gradient(180deg, #ff51a2, #8d1eff);
  color: #fff;
  font-weight: bold;
  font-family: var(--mono);
  cursor: pointer;
  text-shadow: 1px 1px 0 #000;
  box-shadow: 0 0 10px rgba(255, 81, 162, .7);
}

.snake-launch-button:hover {
  filter: brightness(1.15);
}

.snake-direct-link {
  margin: 8px 0 0;
  font-size: 11px;
  text-align: center;
}

.snake-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  background:
    radial-gradient(circle at center, rgba(66,247,255,.16), transparent 42%),
    rgba(0, 0, 0, .78);
  display: grid;
  place-items: center;
  padding: 20px;
}

.snake-modal[hidden] {
  display: none;
}

.snake-modal-window {
  width: min(760px, 96vw);
  height: min(820px, 94vh);
  border: 3px ridge #42f7ff;
  background: #05000b;
  box-shadow: 0 0 24px rgba(66, 247, 255, .7), 0 0 60px rgba(255, 81, 162, .35);
  position: relative;
  display: flex;
  flex-direction: column;
}

.snake-modal-titlebar {
  height: 38px;
  flex: 0 0 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 8px;
  border-bottom: 2px ridge #ff51a2;
  background: linear-gradient(90deg, #160022, #320066, #160022);
  color: #42f7ff;
  font-family: var(--mono);
  font-size: 12px;
  font-weight: bold;
  text-shadow: 0 0 5px #42f7ff;
}

.snake-modal-close {
  border: 2px outset #ff51a2;
  background: #ff51a2;
  color: #fff;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: bold;
  cursor: pointer;
}

.snake-modal iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  flex: 1 1 auto;
  background: #05000b;
}

body.snake-modal-open {
  overflow: hidden;
}

@media only screen and (max-width: 700px) {
  .snake-modal {
    padding: 8px;
  }

  .snake-modal-window {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border-width: 2px;
  }

  .snake-modal-titlebar {
    height: 34px;
    flex-basis: 34px;
  }
}



/* V17 SNAKE MODAL SCALING FIX */

.snake-modal {
  padding: clamp(6px, 1.6vw, 18px) !important;
  align-items: center !important;
  justify-content: center !important;
}

.snake-modal-window {
  width: min(1120px, calc(100vw - 18px)) !important;
  height: min(900px, calc(100dvh - 18px)) !important;
  max-width: calc(100vw - 18px) !important;
  max-height: calc(100dvh - 18px) !important;
  overflow: hidden !important;
}

.snake-modal-titlebar {
  flex: 0 0 38px !important;
  min-height: 38px !important;
}

.snake-modal iframe {
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: auto !important;
}

@media only screen and (max-width: 900px) {
  .snake-modal {
    padding: 0 !important;
  }

  .snake-modal-window {
    width: 100vw !important;
    height: 100dvh !important;
    max-width: 100vw !important;
    max-height: 100dvh !important;
    border-left: 0 !important;
    border-right: 0 !important;
  }

  .snake-modal-titlebar {
    flex-basis: 36px !important;
    min-height: 36px !important;
  }
}



/* V19 MULTIROI GAMES LEFT PANEL */

.multiroi-games-panel .panel-title {
  background: linear-gradient(90deg, var(--yellow), var(--acid), var(--cyan), var(--hot));
}

.game-card {
  position: relative;
}

.game-card-badge {
  position: absolute;
  z-index: 2;
  top: 8px;
  left: 8px;
  padding: 3px 6px;
  color: #000;
  background: var(--acid);
  border: 2px outset #fff;
  font: 900 10px/1 var(--mono);
  box-shadow: 2px 2px 0 #000;
}

.game-cover-button {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0 0 9px;
  border: 3px ridge var(--cyan);
  background: #000;
  box-shadow: 0 0 12px rgba(66, 247, 255, .45);
  cursor: pointer;
}

.game-cover-button:hover {
  filter: brightness(1.1) saturate(1.15);
}

.game-cover-image {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  image-rendering: auto;
}

.multiroi-snake-promo {
  border: 2px ridge #42f7ff;
  background: #05000b;
  box-shadow: 0 0 12px rgba(66, 247, 255, .45), inset 0 0 18px rgba(255, 81, 162, .15);
  padding: 8px;
}

.multiroi-snake-promo h3 {
  margin: 0 0 8px;
  color: #42f7ff;
  text-shadow: 0 0 6px #42f7ff;
  font: 900 13px/1.2 var(--mono);
}

.multiroi-snake-promo p {
  font-size: 12px;
  line-height: 1.35;
}

.snake-launch-button {
  width: 100%;
  padding: 8px 10px;
  border: 2px outset #ff51a2;
  background: linear-gradient(180deg, #ff51a2, #8d1eff);
  color: #fff;
  font-weight: bold;
  font-family: inherit;
  cursor: pointer;
  text-shadow: 1px 1px 0 #000;
  box-shadow: 0 0 10px rgba(255, 81, 162, .7);
}

.snake-launch-button:hover {
  filter: brightness(1.15);
}

.snake-direct-link {
  margin: 8px 0 0;
  font-size: 11px;
  text-align: center;
}



/* V24 MULTIROI GAMES POLISH */

.games-panel-body {
  display: grid;
  gap: 14px;
}

.games-intro {
  margin: 0;
  padding: 8px;
  border: 2px dotted var(--cyan);
  background: rgba(0, 0, 0, .28);
  color: var(--muted);
  font: 700 11px/1.45 var(--mono);
}

.multiroi-games-panel .panel-title {
  background: linear-gradient(90deg, var(--yellow), var(--acid), var(--cyan), var(--hot));
}

.multiroi-game-card {
  position: relative;
  border: 2px ridge #42f7ff;
  background:
    radial-gradient(circle at 50% 0%, rgba(66, 247, 255, .13), transparent 45%),
    #05000b;
  box-shadow:
    0 0 12px rgba(66, 247, 255, .45),
    inset 0 0 18px rgba(255, 81, 162, .15);
  padding: 8px;
}

.multiroi-game-card + .multiroi-game-card {
  margin-top: 4px;
}

.game-card-badge {
  position: absolute;
  z-index: 2;
  top: 8px;
  left: 8px;
  padding: 3px 6px;
  color: #000;
  background: var(--acid);
  border: 2px outset #fff;
  font: 900 10px/1 var(--mono);
  box-shadow: 2px 2px 0 #000;
}

.game-cover-button {
  display: block;
  width: 100%;
  padding: 0;
  margin: 0 0 9px;
  border: 3px ridge var(--cyan);
  background: #000;
  box-shadow: 0 0 12px rgba(66, 247, 255, .45);
  cursor: pointer;
  overflow: hidden;
}

.game-cover-button:hover {
  filter: brightness(1.1) saturate(1.15);
}

.game-cover-image {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  image-rendering: auto;
}

.multiroi-game-card h3 {
  margin: 0 0 8px;
  color: #42f7ff;
  text-shadow: 0 0 6px #42f7ff;
  font: 900 13px/1.2 var(--mono);
}

.multiroi-game-card p {
  font-size: 12px;
  line-height: 1.35;
}

.game-launch-button,
.snake-launch-button.game-launch-button {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 9px 8px !important;
  border: 2px outset #ff51a2 !important;
  background: linear-gradient(180deg, #ff51a2, #8d1eff) !important;
  color: #fff !important;
  font: 900 clamp(10px, .95vw, 13px)/1.18 var(--mono) !important;
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: 1px 1px 0 #000 !important;
  box-shadow: 0 0 10px rgba(255, 81, 162, .7) !important;
  cursor: pointer !important;
  white-space: normal !important;
}

.game-launch-button:hover {
  filter: brightness(1.15);
}

.snake-direct-link {
  margin: 8px 0 0;
  font-size: 11px;
  text-align: center;
}

.clicker-modal-window {
  width: min(1280px, calc(100vw - 18px)) !important;
  height: min(940px, calc(100dvh - 18px)) !important;
}

@media only screen and (max-width: 900px) {
  .clicker-modal-window {
    width: 100vw !important;
    height: 100dvh !important;
  }
}



/* V25 CLICKER MODAL SAFETY */

.clicker-modal-window {
  width: min(1280px, calc(100vw - 18px)) !important;
  height: min(940px, calc(100dvh - 18px)) !important;
}

@media only screen and (max-width: 900px) {
  .clicker-modal-window {
    width: 100vw !important;
    height: 100dvh !important;
  }
}



/* V29 GAME HIGHSCORES SIDEBAR */

.game-highscores {
  display: grid;
  gap: 10px;
}

.game-highscore-group {
  border: 2px inset #6c6a8e;
  background: #05060a;
  padding: 8px;
  box-shadow: inset 0 0 12px rgba(66, 247, 255, .12);
}

.game-highscore-group h3 {
  margin: 0 0 6px;
  color: var(--acid);
  font: 900 12px/1.2 var(--mono);
  text-shadow: 0 0 5px rgba(141,255,0,.8);
  text-transform: uppercase;
}

.game-highscore-group ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
}

.game-highscore-group li {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) auto;
  gap: 5px;
  align-items: baseline;
  font: 800 11px/1.25 var(--mono);
  color: var(--muted);
}

.highscore-rank {
  color: var(--yellow);
}

.highscore-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.highscore-points {
  color: var(--cyan);
  text-shadow: 0 0 4px rgba(66,247,255,.7);
}

.highscore-empty,
.highscore-loading {
  color: var(--muted);
  font: 800 11px/1.4 var(--mono);
}



/* V31 ROIVANDERS CARD + MODAL */

.multiroi-roivanders-promo {
  border-color: #fff200;
  box-shadow:
    0 0 12px rgba(255, 242, 0, .42),
    inset 0 0 18px rgba(255, 81, 162, .16);
}

.multiroi-roivanders-promo h3 {
  color: #fff200;
  text-shadow: 0 0 6px rgba(255,242,0,.85);
}

.roivanders-modal-window {
  width: min(1260px, calc(100vw - 18px)) !important;
  height: min(900px, calc(100dvh - 18px)) !important;
}

@media only screen and (max-width: 900px) {
  .roivanders-modal-window {
    width: 100vw !important;
    height: 100dvh !important;
  }
}



/* V33 ROIBREAKER CARD + MODAL */

.multiroi-roibreaker-promo {
  border-color: #ff51a2;
  box-shadow:
    0 0 12px rgba(255, 81, 162, .48),
    inset 0 0 18px rgba(57, 216, 255, .15);
}

.multiroi-roibreaker-promo h3 {
  color: #ff51a2;
  text-shadow: 0 0 6px rgba(255,81,162,.9);
}

.roibreaker-modal-window {
  width: min(1320px, calc(100vw - 18px)) !important;
  height: min(940px, calc(100dvh - 18px)) !important;
}

@media only screen and (max-width: 900px) {
  .roibreaker-modal-window {
    width: 100vw !important;
    height: 100dvh !important;
  }
}