/* ════════════════════════════════════════════════════════════
   NephewQuin 99 — retro desktop theme
   Only active when <html> has class "w99" (set by /theme.js).
   The sunset theme in each page is untouched; this file only
   overrides it while 99 mode is on.
   ════════════════════════════════════════════════════════════ */

/* ── Floating toggle (shown in the sunset theme) ── */
.nq-theme-toggle {
  position: fixed; left: 16px; bottom: 16px; z-index: 300;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px; border-radius: 20px;
  border: 1px solid rgba(255,255,255,0.6);
  background: rgba(255,240,250,0.75);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  color: #4a1942; font: 700 0.75rem/1 'Quicksand', sans-serif; letter-spacing: 0.5px;
  box-shadow: 0 4px 16px rgba(140,50,120,0.2), inset 0 1px 0 rgba(255,255,255,0.7);
  cursor: url('/cursor-pointer.png') 14 2, pointer;
  transition: transform 0.2s, box-shadow 0.2s;
}
.nq-theme-toggle:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(140,50,120,0.3), inset 0 1px 0 rgba(255,255,255,0.7); }
.nq-theme-toggle:focus-visible { outline: 2px solid #d946a8; outline-offset: 2px; }
.nq-theme-toggle .ico { width: 18px; height: 14px; flex: 0 0 auto; }
html.w99 .nq-theme-toggle { display: none; }

.w99-taskbar, .w99-startmenu { display: none; }

/* ── Palette: re-point the sunset variables ── */
html.w99 {
  --w-face: #d4d0c8; --w-hi: #ffffff; --w-lt: #dfdfdf; --w-sh: #808080; --w-dk: #404040;
  --w-desk: #3a6ea5; --w-navy: #0a246a;
  --w-title: linear-gradient(90deg, #0a246a, #a6caf0);
  --w-raised: inset -1px -1px #404040, inset 1px 1px #ffffff, inset -2px -2px #808080, inset 2px 2px #dfdfdf;
  --w-sunken: inset 1px 1px #808080, inset -1px -1px #ffffff, inset 2px 2px #404040, inset -2px -2px #dfdfdf;
  --w-etched: inset 1px 1px #808080, inset -1px -1px #ffffff, 1px 1px 0 #ffffff;
  --w-btns: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='14'%3E%3Cg%3E%3Crect width='16' height='14' fill='%23404040'/%3E%3Crect width='15' height='13' fill='%23fff'/%3E%3Crect x='1' y='1' width='14' height='12' fill='%23808080'/%3E%3Crect x='1' y='1' width='13' height='11' fill='%23d4d0c8'/%3E%3Crect x='4' y='9' width='6' height='2' fill='%23000'/%3E%3C/g%3E%3Cg transform='translate(16 0)'%3E%3Crect width='16' height='14' fill='%23404040'/%3E%3Crect width='15' height='13' fill='%23fff'/%3E%3Crect x='1' y='1' width='14' height='12' fill='%23808080'/%3E%3Crect x='1' y='1' width='13' height='11' fill='%23d4d0c8'/%3E%3Crect x='3.5' y='2.5' width='8' height='7' fill='none' stroke='%23000'/%3E%3Crect x='3' y='2' width='9' height='2' fill='%23000'/%3E%3C/g%3E%3Cg transform='translate(34 0)'%3E%3Crect width='16' height='14' fill='%23404040'/%3E%3Crect width='15' height='13' fill='%23fff'/%3E%3Crect x='1' y='1' width='14' height='12' fill='%23808080'/%3E%3Crect x='1' y='1' width='13' height='11' fill='%23d4d0c8'/%3E%3Cpath d='M4 3l7 7M11 3l-7 7' stroke='%23000' stroke-width='1.6'/%3E%3C/g%3E%3C/svg%3E");

  --aero-blue: #0a246a; --aero-sky: #0a246a; --aero-green: #0a246a; --aero-orange: #0a246a;
  --aero-glass: #d4d0c8; --aero-glass-strong: #d4d0c8; --aero-glass-border: #808080;
  --aero-shadow: none; --aero-shadow-hover: none;
  --text-dark: #000; --text-medium: #000; --text-light: #333;
  --gradient-sky: #3a6ea5; --gradient-btn: #d4d0c8;
  color-scheme: light;
}

/* ── Base ── */
html.w99 body {
  background: var(--w-desk) !important;
  color: #000 !important;
  cursor: default !important;
  padding-bottom: 44px !important;
}
html.w99 *, html.w99 *::before, html.w99 *::after {
  font-family: Tahoma, Verdana, "Segoe UI", Geneva, sans-serif !important;
  border-radius: 0 !important;
  text-shadow: none !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  letter-spacing: 0 !important;
}
html.w99 .live-dot, html.w99 .stat-dot { border-radius: 50% !important; }
html.w99 a, html.w99 button, html.w99 [onclick], html.w99 label, html.w99 .sponsor-card,
html.w99 a:hover, html.w99 button:hover { cursor: pointer !important; }
html.w99 input, html.w99 textarea { cursor: text !important; }
html.w99 #gameCanvas { cursor: crosshair !important; }
html.w99 ::selection { background: #0a246a; color: #fff; }

/* Decorations from the sunset theme */
html.w99 .bg-orbs, html.w99 .bubble, html.w99 .bg-grid, html.w99 .noise,
html.w99 .stream-corner, html.w99 .divider { display: none !important; }

/* Gradient text → plain */
html.w99 .logo, html.w99 .highlight, html.w99 .error-code, html.w99 .error-code::before {
  background: none !important; -webkit-text-fill-color: currentColor !important; color: inherit;
}

/* Plain links inside content */
html.w99 p a, html.w99 .legal-card li a, html.w99 .glass-card li a, html.w99 footer a, html.w99 .disclosure a { color: #0000ee !important; text-decoration: underline !important; }

/* ── Windows ── */
html.w99 .chat-section, html.w99 .sponsors, html.w99 .support, html.w99 .videos,
html.w99 .discord-section, html.w99 .contact, html.w99 .socials,
html.w99[data-page="home"] .hero, html.w99[data-page="xidax"] .hero,
html.w99 .glass-card, html.w99 .legal-card, html.w99 .card, html.w99 .screen-card,
html.w99 .hero-section, html.w99[data-page="socials"] .wrapper {
  background: var(--w-face) !important;
  color: #000 !important;
  border: none !important;
  box-shadow: var(--w-raised), 2px 2px 0 rgba(0,0,0,0.25) !important;
  padding: 3px 14px 18px !important;
}
html.w99 .chat-section, html.w99 .sponsors, html.w99 .support, html.w99 .videos,
html.w99 .discord-section, html.w99 .contact, html.w99[data-page="home"] .hero {
  width: calc(100% - 24px);
  margin: 22px auto !important;
}
html.w99 .glass-card, html.w99 .legal-card, html.w99 .hero-section,
html.w99[data-page="xidax"] .hero { margin-bottom: 18px !important; }

/* Title bars: real headings, or generated for windows without one */
html.w99 .section-title, html.w99 .glass-card > h2:first-child, html.w99 .card-title,
html.w99 .legal-card > h2:first-child, html.w99 .card > h2:first-child, html.w99 .screen-card > h1:first-child,
html.w99[data-page="home"] .hero::before, html.w99[data-page="xidax"] .hero::before,
html.w99 .hero-section::before, html.w99[data-page="socials"] .wrapper::before {
  display: block !important;
  background: var(--w-btns) no-repeat right 3px center, var(--w-title) !important;
  color: #fff !important; -webkit-text-fill-color: #fff !important;
  font-size: 13px !important; font-weight: bold !important; line-height: 1.4 !important;
  text-align: left !important; text-transform: none !important;
  padding: 3px 60px 3px 6px !important;
  margin: 0 -11px 14px !important;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  align-self: stretch;
}
html.w99[data-page="home"] .hero::before { content: "stream.exe — Live"; grid-column: 1 / -1; }
html.w99[data-page="xidax"] .hero::before { content: "XIDAX — The Stream Rig"; }
html.w99 .hero-section::before { content: "Start Here — Beginner's Guide"; }
html.w99[data-page="socials"] .wrapper::before { content: "Links"; width: auto; }
html.w99 .section-subtitle, html.w99 .card-sub { color: #000 !important; font-size: 12px !important; }

/* Text on the desktop (outside windows) */
html.w99 .page-title, html.w99 .page-subtitle, html.w99 .error-code,
html.w99 .disclosure, html.w99 .disclaimer, html.w99 .back-link-desk {
  color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html.w99 .page-title { font-weight: bold !important; }
html.w99 .disclaimer { border-top: none !important; }
html.w99 .disclaimer a { color: #fff !important; }

/* Headings & body text inside windows */
html.w99 h1, html.w99 h2, html.w99 h3, html.w99 h4 { color: #000; font-weight: bold !important; }
html.w99 .hero-text h1, html.w99 .hero h1 { color: #000 !important; font-weight: bold !important; }
html.w99 .highlight, html.w99 .hero h1 .sub { color: #0a246a !important; }
html.w99 .hero-text p, html.w99 .hero .intro p, html.w99 .hero-section p { color: #000 !important; opacity: 1 !important; }

/* ── Group boxes (etched) ── */
html.w99 .support-card, html.w99 .step, html.w99 .game-card, html.w99 .tip-card,
html.w99 .feature, html.w99 .how-item, html.w99 .contact-card,
html.w99 .discord-stat, html.w99 .discord-info {
  background: transparent !important; color: #000 !important;
  border: none !important; box-shadow: var(--w-etched) !important;
  transform: none !important;
}
html.w99 .step { border-bottom: none !important; padding: 12px !important; }
html.w99 .support-card::before { display: none !important; }
html.w99 .icon-wrap, html.w99 .step-number, html.w99 .contact-icon {
  background: var(--w-face) !important; color: #000 !important; box-shadow: var(--w-raised) !important;
  border: none !important;
}

/* ── Sunken frames (video, chat, photos) ── */
html.w99 .stream-container, html.w99 .chat-container, html.w99 .videos-embed,
html.w99 .discord-widget, html.w99 .video-wrap {
  background: #000 !important; border: none !important;
  box-shadow: var(--w-sunken) !important; padding: 2px !important;
}
html.w99 .stream-placeholder { color: #c0c0c0 !important; }

/* ── Clickable tiles ── */
html.w99 .sponsor-card, html.w99 .link-btn {
  background: var(--w-face) !important; color: #000 !important;
  border: none !important; box-shadow: var(--w-raised) !important;
  transform: none !important; opacity: 1 !important;
}
html.w99 .sponsor-card:active, html.w99 .link-btn:active { box-shadow: var(--w-sunken) !important; }
html.w99 .sponsor-card img { opacity: 1 !important; }
html.w99 .sponsor-code { color: #000 !important; }
html.w99 .sponsor-code .code-text, html.w99 .code-chip .code {
  background: #fff !important; color: #0a246a !important; -webkit-text-fill-color: #0a246a !important;
  box-shadow: var(--w-sunken) !important; border: none !important; padding: 1px 6px !important;
}
html.w99 .link-btn { justify-content: flex-start; }
html.w99 .link-btn svg { color: #000; }
html.w99 .section-label {
  color: #000 !important; font-weight: bold !important; font-size: 11px !important;
  align-self: stretch; text-align: left !important;
  border-bottom: 1px solid #808080; box-shadow: 0 1px 0 #fff;
}
html.w99 .profile h1, html.w99 .profile p { color: #000 !important; }
html.w99 .profile-avatar { box-shadow: var(--w-sunken) !important; border: none !important; padding: 2px; background: #fff; }

/* ── Buttons ── */
html.w99 .btn, html.w99 .btn-primary, html.w99 .btn-secondary, html.w99 .btn-glass,
html.w99 .card-btn, html.w99 .contact-btn, html.w99 .discord-join-btn, html.w99 .platform-btn,
html.w99 .tab-btn, html.w99 .contact-form button, html.w99 button[type="submit"],
html.w99 .code-chip, html.w99 .back-link, html.w99 .nav-links a.nav-sponsor,
html.w99 .partner-pill, html.w99 .w99-btn {
  background: var(--w-face) !important; background-image: none !important;
  color: #000 !important; -webkit-text-fill-color: #000 !important;
  border: none !important; outline: none;
  box-shadow: var(--w-raised) !important;
  font-size: 12px !important; font-weight: normal !important;
  text-transform: none !important; text-decoration: none !important;
  padding: 5px 16px !important; min-height: 24px;
  transform: none !important; transition: none !important; filter: none !important;
}
html.w99 .btn-primary, html.w99 .contact-form button[type="submit"] {
  box-shadow: 0 0 0 1px #000, var(--w-raised) !important;
}
html.w99 .btn:active, html.w99 .card-btn:active, html.w99 .contact-btn:active, html.w99 .discord-join-btn:active,
html.w99 .platform-btn:active, html.w99 .tab-btn:active, html.w99 .contact-form button:active,
html.w99 .code-chip:active, html.w99 .nav-links a.nav-sponsor:active, html.w99 .w99-btn:active {
  box-shadow: var(--w-sunken) !important; padding: 6px 15px 4px 17px !important;
}
html.w99 .platform-btn.active, html.w99 .tab-btn.active, html.w99 .w99-start[aria-expanded="true"] {
  box-shadow: var(--w-sunken) !important;
  background: repeating-conic-gradient(#fff 0 25%, #d4d0c8 0 50%) 0 0 / 2px 2px !important;
  font-weight: bold !important;
}
html.w99 .btn:focus-visible, html.w99 .card-btn:focus-visible, html.w99 .platform-btn:focus-visible,
html.w99 .tab-btn:focus-visible, html.w99 .w99-btn:focus-visible, html.w99 .sponsor-card:focus-visible,
html.w99 .link-btn:focus-visible {
  outline: 1px dotted #000 !important; outline-offset: -5px !important;
}
html.w99 .btn svg, html.w99 .card-btn svg, html.w99 .platform-btn svg { width: 14px; height: 14px; }
html.w99 .nav-links a.nav-sponsor { font-weight: bold !important; padding: 2px 10px !important; min-height: 0; }
html.w99 .partner-pill .dot { background: #008000 !important; box-shadow: none !important; border-radius: 50% !important; }
html.w99 .partner-pill .x { color: #000 !important; }
html.w99 .code-chip { border: none !important; }
html.w99 .code-chip .copy { background: transparent !important; color: #000 !important; padding: 0 !important; text-decoration: underline; }

/* ── Form fields ── */
html.w99 input, html.w99 textarea, html.w99 select {
  background: #fff !important; color: #000 !important;
  border: none !important; box-shadow: var(--w-sunken) !important;
  padding: 5px 7px !important; font-size: 13px !important;
}
html.w99 input:focus, html.w99 textarea:focus { outline: none !important; }
html.w99 label { color: #000 !important; }

/* ── Menu bar (top nav) ── */
html.w99 nav {
  background: var(--w-face) !important;
  border: none !important;
  box-shadow: inset 0 1px #fff, inset 0 -1px #808080, 0 1px 0 #404040 !important;
  padding: 3px 8px !important;
}
html.w99 nav .logo {
  color: #000 !important; font-size: 13px !important; font-weight: bold !important;
  display: inline-flex !important; align-items: center; gap: 6px; text-decoration: none;
}
html.w99 nav .logo::before {
  content: ""; width: 18px; height: 18px; flex: 0 0 auto;
  background: url('/icon-192.png') center / contain no-repeat;
}
html.w99 .nav-links { gap: 0 !important; }
html.w99 .nav-links a {
  color: #000 !important; -webkit-text-fill-color: #000 !important;
  font-size: 12px !important; font-weight: normal !important; text-transform: none !important;
  padding: 3px 8px !important;
}
html.w99 .nav-links a::after { display: none !important; }
html.w99 .nav-links a:not(.nav-sponsor):hover, html.w99 .nav-links a:not(.nav-sponsor):focus-visible {
  background: #0a246a !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
}
html.w99 .live-badge {
  background: #fff !important; color: #c00000 !important; border: none !important;
  box-shadow: var(--w-sunken) !important; font-size: 11px !important; padding: 2px 8px !important;
}
html.w99 .live-dot { background: #c00000 !important; box-shadow: none !important; }

/* ── Announcement → tooltip balloon ── */
html.w99 .announcement {
  background: #ffffe1 !important; color: #000 !important;
  border: none !important; box-shadow: inset 0 -1px #000 !important;
}
html.w99 .announcement a { color: #0000ee !important; }
html.w99 .announcement .close-btn { color: #000 !important; }

/* ── Footer → status bar ── */
html.w99 footer {
  background: var(--w-face) !important; color: #000 !important;
  border: none !important; box-shadow: inset 0 1px #fff, 0 -1px 0 #808080 !important;
  font-size: 12px !important; padding: 10px 12px !important;
}

/* ── Page specifics ── */
/* Legal tabs */
html.w99 .tab-bar { gap: 4px !important; }
html.w99 .legal-card p, html.w99 .legal-card li { color: #000 !important; }
/* 404 */
html.w99 .error-code { animation: none !important; }
html.w99 .card p { color: #000 !important; }
/* Bubble Pop */
html.w99 .hud-item {
  background: var(--w-face) !important; border: none !important;
  box-shadow: var(--w-raised) !important; padding: 4px 14px !important;
}
html.w99 .hud-label { color: #000 !important; font-size: 10px !important; }
html.w99 .hud-value { color: #0a246a !important; font-size: 18px !important; }
html.w99 .final-score { color: #0a246a !important; -webkit-text-fill-color: #0a246a !important; background: none !important; }
html.w99 .combo-display { color: #ffff00 !important; }
/* XIDAX */
html.w99 .hero h1 { color: #000 !important; }
html.w99 .feature p, html.w99 .about-text p, html.w99 .glass-card p { color: #000 !important; }

/* ── Taskbar ── */
html.w99 .w99-taskbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 400; height: 34px;
  display: flex; align-items: center; gap: 4px; padding: 3px 3px 3px 3px;
  background: var(--w-face); box-shadow: inset 0 1px #dfdfdf, inset 0 2px #fff, 0 -1px 0 #d4d0c8;
  font-size: 12px; color: #000;
}
html.w99 .w99-start {
  display: inline-flex !important; align-items: center; gap: 5px; height: 26px;
  font-weight: bold !important; padding: 2px 8px 2px 5px !important; flex: 0 0 auto;
}
html.w99 .w99-start img, html.w99 .w99-task img { width: 16px; height: 16px; }
html.w99 .w99-sep { width: 2px; align-self: stretch; margin: 2px 2px; box-shadow: inset 1px 0 #808080, inset -1px 0 #fff; }
html.w99 .w99-tasks { flex: 1 1 auto; min-width: 0; display: flex; }
html.w99 .w99-task {
  display: flex; align-items: center; gap: 5px; height: 26px; padding: 0 8px;
  max-width: 220px; min-width: 0; flex: 0 1 220px;
  box-shadow: var(--w-sunken);
  background: repeating-conic-gradient(#fff 0 25%, #d4d0c8 0 50%) 0 0 / 2px 2px;
  font-weight: bold;
}
html.w99 .w99-task span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.w99 .w99-tray {
  display: flex; align-items: center; gap: 6px; height: 26px; padding: 0 8px 0 4px; flex: 0 0 auto;
  box-shadow: inset 1px 1px #808080, inset -1px -1px #fff;
}
html.w99 .w99-tray-btn {
  background: none; border: none; padding: 0 2px; font-size: 14px; line-height: 1; color: #000;
}
html.w99 .w99-tray-btn:focus-visible { outline: 1px dotted #000; }
html.w99 .w99-clock { font-size: 12px; white-space: nowrap; }

/* ── Start menu ── */
html.w99 .w99-startmenu {
  position: fixed; left: 2px; bottom: 33px; z-index: 401;
  display: flex; min-width: 230px;
  background: var(--w-face); box-shadow: var(--w-raised), 2px 2px 0 rgba(0,0,0,0.3);
  padding: 3px;
}
html.w99 .w99-startmenu[hidden] { display: none; }
html.w99 .w99-menu-band {
  width: 24px; flex: 0 0 24px;
  background: linear-gradient(0deg, #0a246a, #a6caf0);
  color: #fff; font-weight: bold; font-size: 15px;
  writing-mode: vertical-rl; transform: rotate(180deg);
  padding: 8px 0; display: flex; align-items: center; white-space: nowrap;
}
html.w99 .w99-menu-band b { color: #d4d0c8; font-weight: normal; }
html.w99 .w99-menu-items { flex: 1; display: flex; flex-direction: column; padding: 2px 0; }
html.w99 .w99-menu-items a, html.w99 .w99-menu-items button {
  display: flex; align-items: center; gap: 10px; text-align: left;
  padding: 7px 16px 7px 8px; font-size: 12px; color: #000 !important; text-decoration: none !important;
  background: none; border: none; width: 100%;
}
html.w99 .w99-menu-items a:hover, html.w99 .w99-menu-items button:hover,
html.w99 .w99-menu-items a:focus-visible, html.w99 .w99-menu-items button:focus-visible {
  background: #0a246a; color: #fff !important; outline: none;
}
html.w99 .w99-menu-items .mi { width: 20px; text-align: center; font-size: 15px; }
html.w99 .w99-menu-items hr { border: none; height: 2px; margin: 3px 2px; box-shadow: inset 0 1px #808080, inset 0 -1px #fff; }

/* ── Startup splash ── */
.w99-boot {
  position: fixed; inset: 0; z-index: 1000; background: #3a6ea5;
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.w99-boot-win {
  width: min(360px, 100%); background: #d4d0c8; padding: 3px 3px 14px;
  box-shadow: inset -1px -1px #404040, inset 1px 1px #fff, inset -2px -2px #808080, inset 2px 2px #dfdfdf, 3px 3px 0 rgba(0,0,0,0.3);
  font: 12px Tahoma, Verdana, sans-serif; color: #000;
}
.w99-boot-title { background: linear-gradient(90deg, #0a246a, #a6caf0); color: #fff; font-weight: bold; padding: 3px 6px; margin-bottom: 12px; }
.w99-boot-body { display: flex; gap: 12px; align-items: center; padding: 0 12px 10px; }
.w99-boot-body img { width: 40px; height: 40px; }
.w99-boot-bar { margin: 0 12px; height: 18px; padding: 2px; box-shadow: inset 1px 1px #808080, inset -1px -1px #fff; background: #fff; }
.w99-boot-fill { height: 100%; width: 0; background: repeating-linear-gradient(90deg, #0a246a 0 9px, transparent 9px 11px); animation: w99fill 0.9s steps(18) forwards; }
@keyframes w99fill { to { width: 100%; } }

/* ── Small screens ── */
@media (max-width: 600px) {
  html.w99 .chat-section, html.w99 .sponsors, html.w99 .support, html.w99 .videos,
  html.w99 .discord-section, html.w99 .contact, html.w99[data-page="home"] .hero {
    width: calc(100% - 16px); margin: 14px auto !important; padding: 3px 10px 14px !important;
  }
  html.w99 .section-title, html.w99[data-page="home"] .hero::before { margin: 0 -7px 12px !important; }
  html.w99 .w99-task { flex-basis: 120px; }
  html.w99 .w99-clock { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .w99-boot-fill { animation: none; width: 100%; }
}