/* =================================================================
   GeForce OS — NVIDIA-themed desktop portfolio
   Hasan Khan
   ================================================================= */

/* ---------- Design tokens ---------- */
:root {
  --green:        #76B900;   /* NVIDIA brand green            */
  --green-bright: #76B900;   /* hover / glow                  */
  --green-neon:   #76B900;   /* highlights                    */
  --green-dim:    #4d7a00;

  --bg-0: #050606;           /* deepest background            */
  --bg-1: #0c0e0c;           /* desktop base                  */
  --panel: rgba(18, 22, 18, 0.66);
  --panel-solid: #121612;
  --panel-2: #181d18;
  --titlebar: rgba(10, 12, 10, 0.78);

  --line: rgba(118, 185, 0, 0.22);
  --line-soft: rgba(255, 255, 255, 0.07);

  --txt: #e9efe6;
  --txt-dim: #9aa79a;
  --txt-faint: #8b968c;

  --amber: #ffb000;
  --red: #ff4d4d;

  --radius: 12px;
  --radius-sm: 8px;
  --menubar-h: 34px;
  --dock-h: 66px;
  --taskbar-h: 56px;
  --shell-top: 0px;
  --shell-bottom: var(--dock-h);
  --dock-h: 66px;
  --taskbar-h: 56px;
  --shell-top: 0px;
  --shell-bottom: var(--dock-h);
  --dock-h: 66px;
  --taskbar-h: 56px;
  --shell-top: 0px;
  --shell-bottom: var(--dock-h);
  --dock-h: 76px;

  --glow: 0 0 18px rgba(118, 185, 0, 0.45);
  --shadow-win: 0 24px 60px -12px rgba(0, 0, 0, 0.75),
                0 0 0 1px rgba(118, 185, 0, 0.18);

  --font-ui: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
  --font-body: 'Inter', 'Segoe UI', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', 'SFMono-Regular', Consolas, monospace;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  height: 100%;
  overflow: hidden;
  background: var(--bg-0);
  color: var(--txt);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a { color: var(--green-bright); text-decoration: none; }
a:hover { text-decoration: underline; }
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
img { max-width: 100%; display: block; }
::selection { background: rgba(118, 185, 0, 0.35); color: #fff; }

/* ---------- Keyboard focus ---------- */
:focus-visible { outline: 2px solid var(--green-neon); outline-offset: 2px; }
.win-light:focus-visible { outline: 2px solid var(--green-neon); outline-offset: 3px; }

/* ---------- Scrollbars ---------- */
.win-body::-webkit-scrollbar,
.term-output::-webkit-scrollbar { width: 10px; height: 10px; }
.dock-inner::-webkit-scrollbar { display: none; }
.win-body::-webkit-scrollbar-thumb,
.term-output::-webkit-scrollbar-thumb {
  background: rgba(118, 185, 0, 0.35);
  border-radius: 10px;
  border: 2px solid transparent;
  background-clip: content-box;
}
.win-body::-webkit-scrollbar-thumb:hover { background: rgba(118, 185, 0, 0.6); background-clip: content-box; }
.win-body { scrollbar-color: rgba(118,185,0,0.4) transparent; scrollbar-width: thin; }

/* =================================================================
   BOOT SPLASH
   ================================================================= */
.boot {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 18px;
  background: radial-gradient(circle at 50% 42%, #0d140d 0%, #030403 72%);
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
.boot.is-done { opacity: 0; visibility: hidden; pointer-events: none; }
.iris-boot {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  width: min(420px, 92vw);
}
.iris-boot-scanner {
  position: relative;
  width: min(220px, 52vw);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
}
.iris-boot-housing {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 4px solid rgba(16, 22, 14, 0.95);
  box-shadow:
    0 0 0 2px rgba(118, 185, 0, 0.28),
    0 0 42px rgba(118, 185, 0, 0.18),
    inset 0 0 36px rgba(0, 0, 0, 0.72);
  background: radial-gradient(circle, rgba(8, 12, 8, 0.35) 0 58%, rgba(0, 0, 0, 0.88) 78%);
}
.iris-boot-blades {
  position: absolute;
  inset: 8%;
}
.iris-boot-blade {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 50%;
  height: 24%;
  margin-top: -12%;
  transform-origin: 0% 50%;
  transform: rotate(var(--blade-angle)) rotate(-46deg);
  background: linear-gradient(90deg, rgba(5, 8, 5, 0.98) 0%, rgba(34, 48, 20, 0.96) 42%, rgba(118, 185, 0, 0.82) 100%);
  clip-path: polygon(0% 50%, 84% 4%, 100% 12%, 100% 88%, 84% 96%);
  box-shadow: inset -1px 0 6px rgba(0, 0, 0, 0.55);
  transition: transform 2.4s cubic-bezier(0.18, 0.86, 0.2, 1);
}
.iris-boot-scanner.is-scanning .iris-boot-blade {
  transform: rotate(var(--blade-angle)) rotate(0deg);
}
.iris-boot-scanner.is-verified .iris-boot-blade {
  transform: rotate(var(--blade-angle)) rotate(8deg);
  filter: brightness(1.35);
}
.iris-boot-scanline {
  position: absolute;
  left: 12%;
  right: 12%;
  height: 2px;
  top: 18%;
  background: linear-gradient(90deg, transparent, rgba(118, 185, 0, 0.95), transparent);
  box-shadow: 0 0 16px rgba(118, 185, 0, 0.75);
  opacity: 0;
  pointer-events: none;
}
.iris-boot-scanner.is-scanning .iris-boot-scanline {
  animation: iris-boot-scan 1.8s ease-in-out 2;
  opacity: 1;
}
.iris-boot-pupil {
  position: relative;
  z-index: 2;
  width: 34%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 0 18px rgba(118, 185, 0, 0.55));
  opacity: 0.15;
  transform: scale(0.82);
  transition: opacity 0.8s ease, transform 0.8s ease, filter 0.8s ease;
}
.iris-boot-scanner.is-scanning .iris-boot-pupil {
  opacity: 0.88;
  transform: scale(1);
}
.iris-boot-scanner.is-verified .iris-boot-pupil {
  opacity: 1;
  filter: drop-shadow(0 0 28px rgba(118, 185, 0, 0.95));
}
.iris-boot-kicker {
  margin: 4px 0 0;
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.24em;
  color: rgba(118, 185, 0, 0.72);
  text-transform: uppercase;
}
.iris-boot-title {
  margin: 0;
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: clamp(1.1rem, 4vw, 1.45rem);
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #e9efe6;
  padding-left: 0.28em;
}
.iris-boot-status {
  margin: 0;
  min-height: 1.2em;
  font-family: var(--font-mono);
  font-size: 0.76rem;
  letter-spacing: 0.08em;
  color: var(--txt-dim);
}
.iris-boot-bar { width: min(280px, 72vw); }
.boot-logo { animation: bootpulse 2.4s ease-in-out infinite; }
.boot-logo img { width: 220px; max-width: 62vw; height: auto; display: block; filter: drop-shadow(var(--glow)); }
.boot-title {
  font-family: var(--font-ui); font-weight: 700; letter-spacing: 0.5em;
  font-size: 1.5rem; text-transform: uppercase;
  background: linear-gradient(90deg, var(--green), var(--green-neon));
  -webkit-background-clip: text; background-clip: text; color: transparent;
  padding-left: 0.5em;
}
.boot-sub { color: var(--txt-faint); font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.2em; }
.boot-bar { width: min(260px, 60vw); height: 4px; background: rgba(255,255,255,0.08); border-radius: 4px; overflow: hidden; }
.boot-bar-fill { height: 100%; width: 0; background: linear-gradient(90deg, var(--green), var(--green-neon)); box-shadow: var(--glow); }
.boot-hint { color: var(--txt-faint); font-size: 0.7rem; font-family: var(--font-mono); margin-top: 2px; opacity: 0; animation: fadein 0.5s ease 1.4s forwards; }

@keyframes iris-boot-scan {
  0% { top: 18%; opacity: 0; }
  8% { opacity: 1; }
  92% { opacity: 1; }
  100% { top: 82%; opacity: 0; }
}

/* OS merge glitch — theme switch */
body.os-glitching #os {
  animation: os-merge-shake 0.54s steps(5) both;
}
@keyframes os-merge-shake {
  0%, 100% { transform: translate(0, 0); filter: none; }
  18% { transform: translate(-5px, 2px) skewX(-1.2deg); filter: hue-rotate(24deg) saturate(1.35); }
  36% { transform: translate(4px, -3px) skewX(1deg); filter: hue-rotate(-18deg) contrast(1.2); }
  54% { transform: translate(-2px, 4px); filter: hue-rotate(40deg) brightness(1.15); }
  72% { transform: translate(3px, -1px) skewX(-0.6deg); filter: saturate(1.5); }
}
.os-merge-glitch {
  position: fixed;
  inset: 0;
  z-index: 9850;
  pointer-events: none;
  overflow: hidden;
  opacity: 0;
}
.os-merge-glitch.is-active { opacity: 1; }
.os-merge-glitch.is-exit { opacity: 0; transition: opacity 0.18s ease; }
.os-merge-glitch__noise,
.os-merge-glitch__scanlines,
.os-merge-glitch__rgb {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.os-merge-glitch__noise {
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,0.03) 0 1px, transparent 1px 3px),
    radial-gradient(circle at 50% 50%, rgba(118,185,0,0.12), transparent 58%);
  mix-blend-mode: screen;
  animation: os-merge-noise 0.54s steps(4) both;
}
.os-merge-glitch__scanlines {
  background: repeating-linear-gradient(0deg, rgba(0,0,0,0) 0 2px, rgba(0,0,0,0.22) 2px 4px);
  opacity: 0.55;
}
.os-merge-glitch__rgb { mix-blend-mode: screen; opacity: 0; }
.os-merge-glitch.is-active .os-merge-glitch__rgb { animation: os-merge-rgb 0.54s ease both; }
.os-merge-glitch__rgb--r { background: rgba(255, 0, 80, 0.16); transform: translateX(-6px); }
.os-merge-glitch__rgb--g { background: rgba(118, 185, 0, 0.14); }
.os-merge-glitch__rgb--b { background: rgba(0, 120, 255, 0.16); transform: translateX(6px); }
.os-merge-glitch__brands {
  position: absolute;
  left: 50%;
  top: 46%;
  width: min(280px, 70vw);
  height: min(120px, 28vw);
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
}
.os-merge-glitch__brands img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  opacity: 0;
  filter: drop-shadow(0 0 18px rgba(255,255,255,0.35));
}
.os-merge-glitch.is-active .os-merge-glitch__apple { animation: os-merge-brand 0.54s ease both; }
.os-merge-glitch.is-active .os-merge-glitch__msft { animation: os-merge-brand 0.54s ease 0.04s both; }
.os-merge-glitch.is-active .os-merge-glitch__nvidia { animation: os-merge-brand 0.54s ease 0.08s both; }
.os-merge-glitch__label {
  position: absolute;
  left: 50%;
  bottom: 18%;
  transform: translateX(-50%);
  margin: 0;
  font-family: var(--font-mono);
  font-size: 0.74rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(233, 239, 230, 0.88);
  opacity: 0;
}
.os-merge-glitch.is-active .os-merge-glitch__label {
  animation: os-merge-label 0.54s ease 0.08s both;
}
.os-merge-glitch__label span { color: var(--green); }
@keyframes os-merge-noise {
  0%, 100% { opacity: 0.2; transform: scale(1); }
  40% { opacity: 0.95; transform: scale(1.03); }
  70% { opacity: 0.45; transform: scale(0.99); }
}
@keyframes os-merge-rgb {
  0%, 100% { opacity: 0; }
  22%, 58% { opacity: 0.85; }
}
@keyframes os-merge-brand {
  0% { opacity: 0; transform: scale(0.4) rotate(-12deg); filter: blur(8px); }
  35% { opacity: 1; transform: scale(1.12) rotate(4deg); filter: blur(0); }
  68% { opacity: 0.85; transform: scale(1) rotate(0deg); }
  100% { opacity: 0; transform: scale(1.35); filter: blur(6px); }
}
@keyframes os-merge-label {
  0% { opacity: 0; letter-spacing: 0.05em; }
  30% { opacity: 1; letter-spacing: 0.16em; }
  100% { opacity: 0; }
}

@keyframes bootspin { to { transform: rotate(360deg); } }
@keyframes bootpulse { 50% { filter: brightness(1.3); } }
@keyframes fadein { to { opacity: 1; } }

/* =================================================================
   DESKTOP + WALLPAPER
   ================================================================= */
#os { position: fixed; inset: 0; display: flex; flex-direction: column; }

.desktop {
  position: relative; flex: 1; overflow: hidden;
  margin-top: var(--menubar-h);
}
.desktop-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; pointer-events: none; }
.desktop-bg { position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; }
.desktop-bg::before {
  content: ""; position: absolute; inset: -20%;
  background:
    radial-gradient(ellipse 60% 50% at 20% 10%, rgba(118,185,0,0.16), transparent 60%),
    radial-gradient(ellipse 50% 60% at 85% 90%, rgba(118,185,0,0.10), transparent 60%),
    linear-gradient(180deg, rgba(6,8,6,0.55), rgba(6,8,6,0.80));
  animation: bgdrift 24s ease-in-out infinite alternate;
}
@keyframes bgdrift { to { transform: translate(2%, -2%) scale(1.05); } }

.blackhole,
.whitehole,
.greyhole {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 480;
  width: clamp(105px, 9.8vw, 168px);
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: visible;
  pointer-events: none;
  transform: translate3d(0, 0, 0);
  will-change: transform, width, filter;
}
.blackhole::before {
  content: "";
  position: absolute;
  inset: -35%;
  border-radius: 50%;
  background: radial-gradient(circle, transparent 38%, rgba(20,0,35,0.45) 52%, rgba(0,0,0,0.35) 62%, transparent 74%);
  filter: blur(6px);
  animation: bh-outer-aura 2.4s ease-in-out infinite;
  pointer-events: none;
  z-index: -1;
}
.whitehole::before {
  content: "";
  position: absolute;
  inset: -30%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.55) 0 18%, rgba(190,225,255,0.22) 34%, transparent 62%);
  filter: blur(8px);
  animation: wh-outer-aura 1.6s ease-in-out infinite;
  pointer-events: none;
  z-index: -1;
}
@keyframes bh-outer-aura {
  0%, 100% { opacity: 0.55; transform: scale(0.96); }
  50% { opacity: 0.9; transform: scale(1.06); }
}
@keyframes wh-outer-aura {
  0%, 100% { opacity: 0.45; transform: scale(0.94); }
  50% { opacity: 0.85; transform: scale(1.08); }
}
.blackhole-lens,
.blackhole-ring,
.blackhole-core,
.whitehole-lens,
.whitehole-ring,
.whitehole-core,
.greyhole-lens,
.greyhole-ring,
.greyhole-core {
  position: absolute;
  border-radius: inherit;
}
.blackhole-core {
  inset: 40%;
  background: radial-gradient(circle, #000 0 55%, #050508 72%, transparent 100%);
  box-shadow:
    inset 0 0 20px rgba(0,0,0,1),
    0 0 0 1px rgba(80,0,120,0.45),
    0 0 24px rgba(0,0,0,0.95),
    0 0 48px rgba(20,0,40,0.55);
  animation: bh-core-jitter 0.42s steps(2) infinite;
}
.blackhole-lens {
  inset: 0;
  background:
    radial-gradient(circle, transparent 0 22%, rgba(40,0,60,0.35) 26% 30%, rgba(255,255,255,0.08) 33%, rgba(0,0,0,0.2) 48%, transparent 76%),
    conic-gradient(from 35deg, transparent 0 10%, rgba(0,0,0,0.35) 14%, transparent 23%, rgba(118,185,0,0.06) 31%, transparent 45%, rgba(0,0,0,0.28) 58%, transparent 74%, rgba(255,255,255,0.06) 83%, transparent 100%);
  filter: blur(0.5px) drop-shadow(0 0 28px rgba(0,0,0,0.85)) drop-shadow(0 0 18px rgba(60,0,90,0.45));
  -webkit-backdrop-filter: blur(6px) brightness(0.72) contrast(1.28) saturate(0.9);
  backdrop-filter: blur(6px) brightness(0.72) contrast(1.28) saturate(0.9);
  -webkit-mask-image: radial-gradient(circle, transparent 0 20%, #000 24% 78%, transparent 84%);
  mask-image: radial-gradient(circle, transparent 0 20%, #000 24% 78%, transparent 84%);
  opacity: 0.92;
  animation: blackhole-spin 18s linear infinite, bh-lens-flicker 2.8s ease-in-out infinite;
}
.blackhole-ring {
  inset: 28%;
  background:
    radial-gradient(circle, transparent 0 50%, rgba(0,0,0,0.92) 52% 58%, rgba(80,0,120,0.35) 62%, transparent 72%),
    conic-gradient(from 120deg, rgba(0,0,0,0.5), rgba(255,255,255,0.22), rgba(0,0,0,0.65), rgba(118,185,0,0.12), rgba(255,255,255,0.28));
  box-shadow:
    0 0 14px rgba(0,0,0,0.95),
    0 0 32px rgba(40,0,60,0.55),
    0 0 48px rgba(118,185,0,0.12);
  -webkit-mask-image: radial-gradient(circle, transparent 0 48%, #000 52% 66%, transparent 72%);
  mask-image: radial-gradient(circle, transparent 0 48%, #000 52% 66%, transparent 72%);
  animation: blackhole-spin 7s linear infinite reverse, bh-ring-pulse 1.6s ease-in-out infinite;
}
.whitehole {
  z-index: 479;
}
.whitehole-lens {
  inset: -8%;
  background:
    radial-gradient(circle, rgba(255,255,255,0.78) 0 16%, rgba(255,255,255,0.28) 22%, rgba(190,225,255,0.12) 42%, rgba(255,255,255,0.04) 62%, transparent 78%),
    conic-gradient(from 200deg, transparent 0 8%, rgba(255,255,255,0.18) 13%, transparent 24%, rgba(118,185,0,0.08) 38%, transparent 52%, rgba(255,255,255,0.14) 67%, transparent 82%, rgba(255,255,255,0.16) 93%, transparent 100%);
  -webkit-backdrop-filter: blur(5px) brightness(1.45) contrast(0.98) saturate(1.1);
  backdrop-filter: blur(5px) brightness(1.45) contrast(0.98) saturate(1.1);
  -webkit-mask-image: radial-gradient(circle, #000 0 66%, transparent 84%);
  mask-image: radial-gradient(circle, #000 0 66%, transparent 84%);
  opacity: 0.38;
  filter: drop-shadow(0 0 24px rgba(255,255,255,0.55)) drop-shadow(0 0 48px rgba(140,210,255,0.35));
  animation: blackhole-spin 14s linear infinite reverse, wh-lens-pulse 1.4s ease-in-out infinite;
}
.whitehole-ring {
  inset: 26%;
  background:
    radial-gradient(circle, transparent 0 46%, rgba(8,8,8,0.65) 48% 54%, rgba(255,255,255,0.98) 58% 66%, rgba(255,255,255,0.35) 70%, transparent 77%),
    conic-gradient(from 20deg, #fff, rgba(255,255,255,0.22), #fff, rgba(8,8,8,0.45), #fff, rgba(118,185,0,0.18));
  box-shadow:
    0 0 16px rgba(255,255,255,0.98),
    0 0 36px rgba(190,225,255,0.62),
    0 0 58px rgba(118,185,0,0.18);
  -webkit-mask-image: radial-gradient(circle, transparent 0 44%, #000 48% 70%, transparent 76%);
  mask-image: radial-gradient(circle, transparent 0 44%, #000 48% 70%, transparent 76%);
  animation: blackhole-spin 6s linear infinite, wh-ring-flare 1.2s ease-in-out infinite;
}
.whitehole-core {
  inset: 38%;
  background: radial-gradient(circle, #fff 0 38%, #f9ffff 56%, rgba(255,255,255,0.72) 70%, transparent 80%);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.45),
    0 0 28px rgba(255,255,255,1),
    0 0 56px rgba(190,225,255,0.68),
    inset 0 0 14px rgba(255,255,255,0.95);
  animation: wh-core-flicker 0.55s steps(2) infinite;
}
.hole-lightning-canvas {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 3;
  mix-blend-mode: screen;
}
.blackhole .hole-lightning-canvas {
  mix-blend-mode: screen;
  filter: contrast(1.2) saturate(1.15);
}
.whitehole .hole-lightning-canvas {
  mix-blend-mode: screen;
  filter: brightness(1.25);
}
.greyhole {
  z-index: 481;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, 0, 0) scale(0.2);
}
.greyhole.is-formed,
.greyhole.is-active {
  opacity: 1;
  visibility: visible;
}
.greyhole.is-formed {
  animation: greyhole-form 1.5s cubic-bezier(0.18, 1, 0.22, 1) both;
}
@keyframes bh-core-jitter {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}
@keyframes bh-lens-flicker {
  0%, 100% { opacity: 0.88; filter: blur(0.5px) drop-shadow(0 0 28px rgba(0,0,0,0.85)); }
  40% { opacity: 0.96; }
  70% { opacity: 0.82; }
}
@keyframes bh-ring-pulse {
  0%, 100% { opacity: 1; filter: brightness(1); }
  50% { opacity: 0.82; filter: brightness(1.15); }
}
@keyframes wh-lens-pulse {
  0%, 100% { opacity: 0.36; }
  50% { opacity: 0.48; }
}
@keyframes wh-ring-flare {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.35); }
}
@keyframes wh-core-flicker {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.25); }
}
.blackhole.is-collapsed,
.whitehole.is-collapsed {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.28s ease, visibility 0.28s ease;
}
.greyhole-lens {
  inset: -7%;
  background:
    radial-gradient(circle, transparent 0 20%, rgba(212,216,214,0.48) 23% 31%, rgba(126,132,128,0.16) 42%, rgba(255,255,255,0.06) 62%, transparent 80%),
    conic-gradient(from 80deg, rgba(255,255,255,0.10), rgba(80,84,82,0.22), rgba(255,255,255,0.20), rgba(118,185,0,0.08), rgba(40,42,41,0.28), rgba(255,255,255,0.14));
  -webkit-backdrop-filter: blur(6px) brightness(1.14) contrast(1.05) grayscale(0.55);
  backdrop-filter: blur(6px) brightness(1.14) contrast(1.05) grayscale(0.55);
  -webkit-mask-image: radial-gradient(circle, transparent 0 19%, #000 24% 76%, transparent 86%);
  mask-image: radial-gradient(circle, transparent 0 19%, #000 24% 76%, transparent 86%);
  opacity: 0.34;
  filter: drop-shadow(0 0 28px rgba(220,220,220,0.36)) drop-shadow(0 0 58px rgba(118,185,0,0.14));
  animation: blackhole-spin 20s linear infinite;
}
.greyhole-ring {
  inset: 28%;
  background:
    radial-gradient(circle, transparent 0 47%, rgba(40,40,40,0.95) 50% 56%, rgba(230,233,231,0.9) 59% 66%, rgba(128,132,130,0.45) 70%, transparent 76%),
    conic-gradient(from 160deg, #f5f5f5, #565a58, #d9dedb, rgba(118,185,0,0.16), #252827, #ffffff);
  box-shadow:
    0 0 12px rgba(230,230,230,0.65),
    0 0 30px rgba(140,145,142,0.5),
    0 0 52px rgba(118,185,0,0.14);
  -webkit-mask-image: radial-gradient(circle, transparent 0 45%, #000 50% 70%, transparent 77%);
  mask-image: radial-gradient(circle, transparent 0 45%, #000 50% 70%, transparent 77%);
  animation: blackhole-spin 9s linear infinite reverse;
}
.greyhole-core {
  inset: 38%;
  background: radial-gradient(circle, #050505 0 38%, #777d78 48%, #e6e9e6 58%, #303432 70%, transparent 78%);
  box-shadow:
    inset 0 0 14px rgba(0,0,0,0.9),
    0 0 0 1px rgba(255,255,255,0.55),
    0 0 22px rgba(215,215,215,0.72),
    0 0 46px rgba(118,185,0,0.18);
}
.cosmic-shatter {
  position: fixed;
  inset: 0;
  z-index: 9600;
  overflow: hidden;
  pointer-events: none;
}
.cosmic-bigbang {
  position: fixed;
  inset: 0;
  z-index: 9550;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(circle at var(--impact-x, 50%) var(--impact-y, 50%), rgba(8,12,18,0.88) 0 18%, rgba(0,0,0,0.96) 46%, #000 100%),
    #000;
}
.cosmic-bigbang::before {
  content: "";
  position: absolute;
  inset: -30%;
  background:
    radial-gradient(circle at var(--impact-x, 50%) var(--impact-y, 50%), rgba(255,255,255,0.88) 0 1.5%, rgba(185,225,255,0.44) 5%, rgba(118,185,0,0.20) 11%, rgba(70,95,150,0.10) 24%, transparent 44%),
    radial-gradient(circle at calc(var(--impact-x, 50%) + 12vw) calc(var(--impact-y, 50%) - 16vh), rgba(255,255,255,0.13), transparent 24%),
    radial-gradient(circle at calc(var(--impact-x, 50%) - 18vw) calc(var(--impact-y, 50%) + 14vh), rgba(118,185,0,0.10), transparent 28%);
  mix-blend-mode: screen;
  animation: bigbang-nebula 22s ease-out forwards;
}
.cosmic-bigbang::after {
  content: "";
  position: absolute;
  left: var(--impact-x, 50%);
  top: var(--impact-y, 50%);
  width: 18vmin;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.7);
  box-shadow:
    0 0 0 1px rgba(118,185,0,0.16),
    0 0 54px rgba(255,255,255,0.36),
    inset 0 0 26px rgba(255,255,255,0.32);
  transform: translate(-50%, -50%) scale(0.05);
  animation: bigbang-shockwave 22s cubic-bezier(0.08, 0.74, 0.1, 1) forwards;
}
.cosmic-bigbang--webgl::before {
  opacity: 0.42;
  mix-blend-mode: soft-light;
}
.cosmic-bigbang--webgl::after {
  opacity: 0.65;
}
.cosmic-bigbang--webgl .bigbang-green-ripple {
  opacity: 0.42;
  mix-blend-mode: normal;
  border-color: rgba(118,185,0,0.38);
  box-shadow: 0 0 14px rgba(118,185,0,0.22), inset 0 0 12px rgba(118,185,0,0.12);
}
.cosmic-bigbang--webgl .bigbang-iris-ring,
.cosmic-bigbang--webgl .bigbang-iris-pupil {
  display: none;
}
.cosmic-bigbang--webgl .bigbang-green-core {
  opacity: 0.72;
  mix-blend-mode: soft-light;
}
.cosmic-bigbang--webgl .bigbang-particle {
  opacity: 0.55;
}
.cosmic-shatter::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at var(--impact-x, 50%) var(--impact-y, 50%), rgba(255,255,255,0.95), rgba(118,185,0,0.26) 16%, rgba(0,0,0,0.58) 42%, rgba(0,0,0,0.82) 72%);
  animation: shatter-flash 6.1s ease-out forwards;
}
.shatter-shard {
  position: absolute;
  left: var(--sx);
  top: var(--sy);
  width: var(--sw);
  height: var(--sh);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.40), rgba(255,255,255,0.06) 44%, rgba(118,185,0,0.10)),
    rgba(12,14,12,0.18);
  border: 1px solid rgba(255,255,255,0.34);
  box-shadow: inset 0 0 18px rgba(255,255,255,0.12), 0 0 22px rgba(255,255,255,0.08);
  -webkit-backdrop-filter: blur(5px) brightness(1.35) contrast(1.12);
  backdrop-filter: blur(5px) brightness(1.35) contrast(1.12);
  clip-path: polygon(var(--p1), var(--p2), var(--p3), var(--p4));
  animation: shard-explode 7.15s cubic-bezier(0.16, 0.72, 0.24, 1) forwards;
  animation-delay: var(--delay);
}
.bigbang-target {
  transform-origin: center center;
  will-change: transform, filter, opacity;
}
.bigbang-target.bigbang-pulled {
  transform: var(--bb-base-transform, translate3d(0, 0, 0)) translate3d(var(--bb-pull-x, 0px), var(--bb-pull-y, 0px), 0) scale(0.72) !important;
  filter: brightness(1.45) contrast(1.08);
  transition: transform 1.16s cubic-bezier(0.18, 0.86, 0.2, 1), filter 1.16s ease;
}
.bigbang-target.bigbang-blasted {
  transform: var(--bb-base-transform, translate3d(0, 0, 0)) translate3d(var(--bb-blast-x, 0px), var(--bb-blast-y, 0px), 0) rotate(var(--bb-rot, 0deg)) scale(0.98) !important;
  filter: brightness(1.18) contrast(1.05);
  transition: transform 2.15s cubic-bezier(0.12, 0.78, 0.18, 1), filter 1.8s ease, opacity 0.3s ease;
}
.bigbang-target.bigbang-hidden {
  opacity: 0;
  visibility: hidden;
}
.reconstruct-shell-muted {
  background: rgba(8, 10, 8, 0) !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(0) saturate(100%) !important;
  backdrop-filter: blur(0) saturate(100%) !important;
}
.dock.reconstruct-shell-muted .dock-inner {
  background: rgba(10, 13, 10, 0) !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(0) saturate(100%) !important;
  backdrop-filter: blur(0) saturate(100%) !important;
}
.reconstruct-hidden {
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translate3d(0, var(--reconstruct-y, 14px), 0) scale(var(--reconstruct-scale, 0.94)) !important;
  filter: blur(8px) brightness(1.55);
  pointer-events: none;
}
.reconstructing {
  visibility: visible !important;
  transform-origin: center center;
  animation: reconstruct-pop 0.82s cubic-bezier(0.17, 0.88, 0.2, 1) both;
}
.dock-inner.reconstructing {
  transform-origin: center bottom;
}
.panel-shatter {
  position: fixed;
  inset: 0;
  z-index: 9575;
  pointer-events: none;
  overflow: hidden;
}
.panel-shard {
  position: absolute;
  left: var(--psx);
  top: var(--psy);
  width: var(--psw);
  height: var(--psh);
  border: 1px solid rgba(118,185,0,0.28);
  background:
    linear-gradient(135deg, rgba(18,22,18,0.68), rgba(255,255,255,0.12)),
    rgba(10,13,10,0.32);
  box-shadow: inset 0 0 18px rgba(255,255,255,0.08), 0 0 18px rgba(118,185,0,0.14);
  -webkit-backdrop-filter: blur(8px) saturate(130%);
  backdrop-filter: blur(8px) saturate(130%);
  clip-path: polygon(var(--p1), var(--p2), var(--p3), var(--p4));
  animation: panel-shard-break 6.45s cubic-bezier(0.18, 0.78, 0.22, 1) forwards;
}
.bigbang-particle {
  position: absolute;
  left: var(--impact-x, 50%);
  top: var(--impact-y, 50%);
  width: var(--particle-size);
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--particle-color);
  box-shadow: 0 0 var(--particle-glow) var(--particle-color);
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.3);
  animation: bigbang-particle-flight 22s cubic-bezier(0.08, 0.66, 0.08, 1) forwards;
  animation-delay: var(--delay);
}
.bigbang-ring {
  position: absolute;
  left: var(--impact-x, 50%);
  top: var(--impact-y, 50%);
  width: var(--ring-size);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid var(--ring-color);
  box-shadow: 0 0 24px var(--ring-color), inset 0 0 24px rgba(255,255,255,0.12);
  transform: translate(-50%, -50%) scale(0.05);
  opacity: 0;
  animation: bigbang-ring-expand 22s cubic-bezier(0.07, 0.76, 0.12, 1) forwards;
  animation-delay: var(--delay);
}
.bigbang-green-ripple {
  position: absolute;
  left: var(--start-x);
  top: var(--start-y);
  width: var(--ripple-size);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(118,185,0,0.58);
  box-shadow:
    0 0 18px rgba(118,185,0,0.34),
    0 0 42px rgba(96,221,142,0.18),
    inset 0 0 22px rgba(118,185,0,0.20);
  opacity: 0;
  mix-blend-mode: screen;
  transform: translate(-50%, -50%) scale(0.28);
  animation: green-ripple-converge 22s cubic-bezier(0.11, 0.78, 0.14, 1) forwards;
  animation-delay: var(--delay);
}
.bigbang-green-core {
  position: absolute;
  left: var(--impact-x, 50%);
  top: var(--impact-y, 50%);
  width: 16vmin;
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(242,255,231,0.95) 0 11%, rgba(118,185,0,0.72) 19%, rgba(96,221,142,0.34) 42%, transparent 72%);
  box-shadow:
    0 0 34px rgba(118,185,0,0.74),
    0 0 86px rgba(96,221,142,0.42),
    0 0 140px rgba(20,17,99,0.28);
  opacity: 0;
  mix-blend-mode: screen;
  transform: translate(-50%, -50%) scale(0.2);
  animation: green-core-collapse 22s ease-in-out forwards;
}
.bigbang-market-chart {
  position: absolute;
  left: var(--impact-x, 50%);
  top: var(--impact-y, 50%);
  width: min(1180px, 94vw);
  height: min(540px, 58vh);
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.88);
  filter: drop-shadow(0 0 28px rgba(118,185,0,0.32));
  mix-blend-mode: screen;
  animation: market-chart-reveal 22s ease-in-out forwards;
}
.bigbang-market-chart svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}
.market-grid {
  fill: none;
  stroke: rgba(118,185,0,0.11);
  stroke-width: 1.4;
}
.market-ghost-line {
  fill: none;
  stroke: rgba(255,255,255,0.15);
  stroke-width: 9;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.38;
  filter: blur(5px);
}
.market-god-line {
  fill: none;
  stroke: #76B900;
  stroke-width: 8;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  filter:
    drop-shadow(0 0 12px rgba(118,185,0,0.78))
    drop-shadow(0 0 38px rgba(96,221,142,0.52));
  animation: market-line-rip 22s cubic-bezier(0.11, 0.8, 0.13, 1) forwards;
}
.market-god-wick,
.market-god-body {
  opacity: 0;
  stroke: #f4ffe8;
  filter:
    drop-shadow(0 0 14px rgba(118,185,0,0.92))
    drop-shadow(0 0 45px rgba(96,221,142,0.58));
  animation: market-candle-rip 22s ease-in-out forwards;
}
.market-god-wick {
  stroke-width: 9;
  stroke-linecap: round;
}
.market-god-body {
  fill: rgba(118,185,0,0.58);
  stroke-width: 4;
  transform-box: fill-box;
  transform-origin: center bottom;
  transform: scaleY(0.04);
}
.market-god-label {
  fill: rgba(234,255,218,0.9);
  font: 800 58px var(--font-ui);
  letter-spacing: 0;
  opacity: 0;
  filter: drop-shadow(0 0 18px rgba(118,185,0,0.72));
  animation: market-label-flash 22s ease-in-out forwards;
}
.bigbang-iris {
  position: absolute;
  left: var(--impact-x, 50%);
  top: var(--impact-y, 50%);
  width: min(76vmin, 720px);
  height: min(76vmin, 720px);
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.bigbang-iris-ring {
  position: absolute;
  inset: 2%;
  border-radius: 50%;
  border: 3px solid rgba(18, 24, 16, 0.92);
  box-shadow:
    0 0 0 2px rgba(118,185,0,0.28),
    0 0 0 5px rgba(8, 12, 8, 0.75),
    0 0 42px rgba(118,185,0,0.22),
    inset 0 0 28px rgba(0,0,0,0.55),
    inset 0 0 12px rgba(118,185,0,0.14);
  background: radial-gradient(circle, rgba(12,16,10,0.55) 0 62%, rgba(4,6,4,0.88) 78%, rgba(0,0,0,0.92) 100%);
  opacity: 0;
  transform: scale(0.42);
  animation: iris-ring-cycle 22s ease-in-out forwards;
}
.bigbang-iris-ring::before {
  content: "";
  position: absolute;
  inset: 8%;
  border-radius: 50%;
  border: 1px solid rgba(118,185,0,0.22);
  box-shadow: inset 0 0 18px rgba(118,185,0,0.12);
}
.bigbang-iris-pupil {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 18%;
  aspect-ratio: 1;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0.2);
  background: radial-gradient(circle, rgba(4,8,4,0.95) 0 55%, rgba(118,185,0,0.35) 72%, transparent 88%);
  box-shadow:
    0 0 0 1px rgba(118,185,0,0.35),
    0 0 24px rgba(118,185,0,0.45),
    inset 0 0 16px rgba(0,0,0,0.85);
  opacity: 0;
  animation: iris-pupil-cycle 22s ease-in-out forwards;
}
.bigbang-iris-blade {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 50%;
  height: 24%;
  margin-top: -12%;
  transform-origin: 0% 50%;
  transform: rotate(var(--blade-angle)) rotate(-42deg) translateX(4%);
  background:
    linear-gradient(90deg,
      rgba(6, 9, 6, 0.95) 0%,
      rgba(22, 32, 18, 0.98) 22%,
      rgba(52, 78, 22, 0.96) 58%,
      rgba(118, 185, 0, 0.88) 88%,
      rgba(210, 240, 160, 0.75) 100%);
  clip-path: polygon(0% 50%, 82% 3%, 100% 10%, 100% 90%, 82% 97%);
  box-shadow: inset -2px 0 8px rgba(0,0,0,0.45);
  filter: drop-shadow(0 0 6px rgba(118,185,0,0.28));
  opacity: 0;
  animation: iris-blade-cycle 22s cubic-bezier(0.12, 0.78, 0.16, 1) forwards;
  animation-delay: calc(var(--blade-i) * 0.04s);
}
.bigbang-iris-spoke {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 3px;
  height: 44%;
  margin-top: -22%;
  transform-origin: 50% 100%;
  transform: rotate(var(--blade-angle)) scaleY(0.2);
  background: linear-gradient(180deg, rgba(118,185,0,0.55), transparent);
  opacity: 0;
  filter: blur(0.3px);
  animation: iris-spoke-cycle 22s ease-out forwards;
  animation-delay: calc(var(--blade-i) * 0.03s);
}
.bigbang-nvidia-eye {
  position: absolute;
  left: var(--impact-x, 50%);
  top: var(--impact-y, 50%);
  width: min(200px, 22vmin);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 50%;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.12) rotate(-18deg);
  filter: blur(16px) brightness(2.8);
  mix-blend-mode: screen;
  animation: nvidia-eye-formation 22s ease-in-out forwards;
}
.bigbang-nvidia-eye::before,
.bigbang-nvidia-eye::after {
  content: "";
  position: absolute;
  inset: 14%;
  border-radius: 50% 10% 50% 10%;
  border: 2px solid rgba(118,185,0,0.72);
  box-shadow:
    0 0 30px rgba(118,185,0,0.58),
    inset 0 0 24px rgba(96,221,142,0.28);
  transform: rotate(-20deg) scaleX(1.42);
  animation: iris-eye-ring 22s ease-in-out forwards;
}
.bigbang-nvidia-eye::after {
  inset: 30%;
  border-color: rgba(246,255,237,0.86);
  transform: rotate(-20deg) scaleX(1.08);
}
.bigbang-nvidia-eye img {
  width: 62%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 0 22px rgba(118,185,0,0.88));
  opacity: 0.92;
  animation: iris-eye-logo 22s ease-in-out forwards;
}
.blackhole-warped {
  --bh-warp-x: 0px;
  --bh-warp-y: 0px;
  --bh-warp-r: 0deg;
  --bh-warp-brightness: 1;
  transform: translate3d(var(--bh-warp-x), var(--bh-warp-y), 0) rotate(var(--bh-warp-r));
  filter: brightness(var(--bh-warp-brightness));
  transition: filter 0.08s linear;
}
.blackhole-text-warped {
  --bh-text-warp-x: 0px;
  --bh-text-warp-y: 0px;
  --bh-text-skew: 0deg;
  --bh-text-r: 0deg;
  --bh-text-brightness: 1;
  --bh-text-shadow-x: 0px;
  --bh-text-shadow-y: 0px;
  transform:
    translate3d(var(--bh-text-warp-x), var(--bh-text-warp-y), 0)
    skew(var(--bh-text-skew))
    rotate(var(--bh-text-r));
  filter: brightness(var(--bh-text-brightness));
  text-shadow:
    var(--bh-text-shadow-x) var(--bh-text-shadow-y) 5px rgba(255,255,255,0.34),
    calc(var(--bh-text-shadow-x) * -0.55) calc(var(--bh-text-shadow-y) * -0.55) 7px rgba(118,185,0,0.2);
}
@keyframes blackhole-spin { to { transform: rotate(360deg); } }
@keyframes greyhole-form {
  0% { transform: translate3d(var(--gh-x, 0px), var(--gh-y, 0px), 0) scale(0.15); filter: brightness(2.4) blur(7px); }
  55% { transform: translate3d(var(--gh-x, 0px), var(--gh-y, 0px), 0) scale(1.22); filter: brightness(1.45) blur(1px); }
  100% { transform: translate3d(var(--gh-x, 0px), var(--gh-y, 0px), 0) scale(1); filter: brightness(1) blur(0); }
}
@keyframes shatter-flash {
  0% { opacity: 0; transform: scale(0.75); }
  7% { opacity: 1; transform: scale(1); }
  72% { opacity: 0.68; transform: scale(1.34); }
  100% { opacity: 0; transform: scale(1.5); }
}
@keyframes shard-explode {
  0% { opacity: 0; transform: translate3d(0, 0, 0) rotate(0deg) scale(0.96); }
  5% { opacity: 1; }
  78% { opacity: 0.88; transform: translate3d(var(--dx), var(--dy), 0) rotate(var(--rot)) scale(1.08); }
  100% { opacity: 0; transform: translate3d(var(--dx-end), var(--dy-end), 0) rotate(var(--rot-end)) scale(1); }
}
@keyframes panel-shard-break {
  0% { opacity: 1; transform: translate3d(0, 0, 0) rotate(0deg) scale(1); }
  82% { opacity: 0.88; transform: translate3d(var(--pdx), var(--pdy), 0) rotate(var(--prot)) scale(1.08); }
  100% { opacity: 0; transform: translate3d(var(--pdx-end), var(--pdy-end), 0) rotate(var(--prot-end)) scale(0.92); }
}
@keyframes bigbang-nebula {
  0% { opacity: 0; transform: scale(0.35) rotate(0deg); filter: saturate(1.8) brightness(2.2); }
  6% { opacity: 0.92; }
  45% { opacity: 0.42; transform: scale(1.15) rotate(18deg); filter: saturate(1.2) brightness(1.15); }
  100% { opacity: 0; transform: scale(1.55) rotate(42deg); filter: saturate(0.8) brightness(0.9); }
}
@keyframes bigbang-shockwave {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(0.05); }
  4% { opacity: 0.9; }
  42% { opacity: 0.24; transform: translate(-50%, -50%) scale(9.5); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(14); }
}
@keyframes bigbang-ring-expand {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(0.05); }
  5% { opacity: 0.78; }
  54% { opacity: 0.22; transform: translate(-50%, -50%) scale(var(--ring-scale-mid)); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(var(--ring-scale-end)); }
}
@keyframes green-ripple-converge {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(0.25) rotate(0deg); filter: blur(0) brightness(1.5); }
  8% { opacity: 0.74; }
  46% { opacity: 0.34; transform: translate(calc(-50% + var(--orbit-x)), calc(-50% + var(--orbit-y))) scale(2.8) rotate(120deg); filter: blur(0.3px) brightness(1.25); }
  78% { opacity: 0.66; transform: translate(calc(-50% + var(--to-x)), calc(-50% + var(--to-y))) scale(0.56) rotate(260deg); filter: blur(0) brightness(1.9); }
  88% { opacity: 0.18; transform: translate(calc(-50% + var(--to-x)), calc(-50% + var(--to-y))) scale(0.2) rotate(330deg); }
  100% { opacity: 0; transform: translate(calc(-50% + var(--to-x)), calc(-50% + var(--to-y))) scale(0.08) rotate(360deg); }
}
@keyframes green-core-collapse {
  0%, 70% { opacity: 0; transform: translate(-50%, -50%) scale(0.18); filter: blur(8px) brightness(2); }
  80% { opacity: 0.95; transform: translate(-50%, -50%) scale(1); filter: blur(0) brightness(1.6); }
  91% { opacity: 0.92; transform: translate(-50%, -50%) scale(0.68); filter: blur(0.5px) brightness(2.1); }
  98%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(0.08); filter: blur(9px) brightness(2.6); }
}
@keyframes iris-ring-cycle {
  0%, 6% { opacity: 0; transform: scale(0.35); filter: blur(8px) brightness(2); }
  16% { opacity: 0.72; transform: scale(0.92); filter: blur(1px) brightness(1.4); }
  38% { opacity: 0.88; transform: scale(1); filter: blur(0) brightness(1.2); }
  58% { opacity: 0.76; transform: scale(0.94); }
  72% { opacity: 0.42; transform: scale(1.08); filter: blur(2px) brightness(1.65); }
  100% { opacity: 0; transform: scale(1.28); filter: blur(10px) brightness(2.2); }
}
@keyframes iris-ring-spin {
  0%, 14% { transform: rotate(0deg); opacity: 0; }
  24% { opacity: 1; }
  100% { transform: rotate(220deg); opacity: 0.2; }
}
@keyframes iris-blade-cycle {
  0%, 7% { opacity: 0; transform: rotate(var(--blade-angle)) rotate(-42deg) translateX(4%) scale(0.5); filter: brightness(1.8); }
  16% { opacity: 0.92; transform: rotate(var(--blade-angle)) rotate(-8deg) translateX(4%) scale(1); filter: brightness(1.15); }
  34% { opacity: 0.98; transform: rotate(var(--blade-angle)) rotate(0deg) translateX(4%) scale(1); filter: brightness(1); }
  48% { opacity: 0.96; transform: rotate(var(--blade-angle)) rotate(2deg) translateX(4%) scale(1); }
  58% { opacity: 0.88; transform: rotate(var(--blade-angle)) rotate(0deg) translateX(4%) scale(1); }
  66% { opacity: 0.62; transform: rotate(var(--blade-angle)) rotate(-22deg) translateX(4%) scale(0.96); filter: brightness(1.35); }
  76% { opacity: 0.28; transform: rotate(var(--blade-angle)) rotate(-38deg) translateX(4%) scale(0.88); }
  100% { opacity: 0; transform: rotate(var(--blade-angle)) rotate(-48deg) translateX(4%) scale(0.72); }
}
@keyframes iris-spoke-cycle {
  0%, 10% { opacity: 0; transform: rotate(var(--blade-angle)) scaleY(0.15); }
  22% { opacity: 0.72; transform: rotate(var(--blade-angle)) scaleY(0.82); }
  42% { opacity: 0.48; transform: rotate(var(--blade-angle)) scaleY(1); }
  64% { opacity: 0.18; transform: rotate(var(--blade-angle)) scaleY(0.42); }
  100% { opacity: 0; transform: rotate(var(--blade-angle)) scaleY(0.1); }
}
@keyframes iris-pupil-cycle {
  0%, 30% { opacity: 0; transform: translate(-50%, -50%) scale(0.12); filter: blur(10px) brightness(2.4); }
  44% { opacity: 0.82; transform: translate(-50%, -50%) scale(0.72); filter: blur(2px) brightness(1.8); }
  54% { opacity: 0.95; transform: translate(-50%, -50%) scale(0.34); filter: blur(0) brightness(2.2); }
  62% { opacity: 0.42; transform: translate(-50%, -50%) scale(0.18); filter: blur(4px) brightness(2.6); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(0.08); filter: blur(12px) brightness(3); }
}
@keyframes iris-eye-ring {
  0%, 78% { opacity: 0; transform: rotate(-20deg) scaleX(1.42) scale(0.4); }
  84% { opacity: 1; transform: rotate(-8deg) scaleX(1.38) scale(1.05); }
  92% { opacity: 0.9; transform: rotate(0deg) scaleX(1.32) scale(1); }
  100% { opacity: 0; transform: rotate(12deg) scaleX(1.2) scale(0.7); }
}
@keyframes iris-eye-logo {
  0%, 80% { opacity: 0; transform: scale(0.2); filter: blur(8px) brightness(2.6); }
  86% { opacity: 0.95; transform: scale(1.08); filter: blur(0) brightness(1.5); }
  94% { opacity: 0.88; transform: scale(1); }
  100% { opacity: 0; transform: scale(0.72); filter: blur(6px) brightness(2.2); }
}
@keyframes nvidia-eye-formation {
  0%, 78% { opacity: 0; transform: translate(-50%, -50%) scale(0.12) rotate(-18deg); filter: blur(16px) brightness(2.8); }
  84% { opacity: 0.98; transform: translate(-50%, -50%) scale(1.08) rotate(-4deg); filter: blur(1px) brightness(1.75); }
  90% { opacity: 0.94; transform: translate(-50%, -50%) scale(1) rotate(0deg); filter: blur(0) brightness(1.4); }
  96% { opacity: 0.82; transform: translate(-50%, -50%) scale(0.96) rotate(2deg); filter: blur(0) brightness(1.5); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(0.58) rotate(10deg); filter: blur(10px) brightness(2.2); }
}
@keyframes market-chart-reveal {
  0%, 76% { opacity: 0; transform: translate(-50%, -50%) scale(0.82); filter: blur(8px) brightness(1.8); }
  82% { opacity: 0.36; transform: translate(-50%, -50%) scale(0.94); filter: blur(2px) brightness(1.35); }
  91% { opacity: 0.82; transform: translate(-50%, -50%) scale(1); filter: blur(0) brightness(1.15); }
  97% { opacity: 0.72; transform: translate(-50%, -50%) scale(1.03); filter: blur(0) brightness(1.35); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1.1); filter: blur(7px) brightness(2); }
}
@keyframes market-line-rip {
  0%, 77% { stroke-dashoffset: 1000; }
  88% { stroke-dashoffset: 310; }
  96%, 100% { stroke-dashoffset: 0; }
}
@keyframes market-candle-rip {
  0%, 84% { opacity: 0; transform: scaleY(0.04); }
  90% { opacity: 0.95; transform: scaleY(0.34); }
  96%, 100% { opacity: 0.9; transform: scaleY(1); }
}
@keyframes market-label-flash {
  0%, 86% { opacity: 0; transform: translateY(16px); }
  92% { opacity: 0.9; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(-8px); }
}
@keyframes bigbang-particle-flight {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(0.25); filter: brightness(2); }
  5% { opacity: var(--particle-opacity); }
  62% { opacity: calc(var(--particle-opacity) * 0.55); transform: translate(calc(-50% + var(--dx-mid)), calc(-50% + var(--dy-mid))) scale(1); filter: brightness(1.2); }
  100% { opacity: 0; transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(0.35); filter: brightness(0.8); }
}
@keyframes reconstruct-pop {
  0% {
    opacity: 0;
    transform: translate3d(0, var(--reconstruct-y, 12px), 0) scale(var(--reconstruct-scale, 0.94));
    filter: blur(10px) brightness(1.8);
  }
  42% {
    opacity: 1;
    transform: translate3d(0, -2px, 0) scale(1.025);
    filter: blur(1px) brightness(1.35);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: blur(0) brightness(1);
  }
}

.desktop-watermark {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; pointer-events: none; user-select: none; text-align: center;
}
.windows-mobile-hint { display: none; }
.cosmic-active .desktop-watermark,
.cosmic-active .windows-mobile-hint,
.cosmic-active .mobile-launcher,
.cosmic-active .desktop-widgets,
.cosmic-suppressed {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.desktop-split-logo { display: none; }
.desktop-watermark > img { width: 132px; opacity: 0.10; filter: grayscale(0.1); }
.desktop-watermark p { color: var(--txt-faint); font-family: var(--font-mono); font-size: 0.78rem; letter-spacing: 0.15em; opacity: 0.5; }

/* =================================================================
   MENU BAR (top)
   ================================================================= */
.menubar {
  position: fixed; top: 0; left: 0; right: 0; height: var(--menubar-h); z-index: 500;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 14px;
  background: rgba(8, 10, 8, 0.72);
  backdrop-filter: blur(14px) saturate(140%); -webkit-backdrop-filter: blur(14px) saturate(140%);
  border-bottom: 1px solid var(--line);
  font-family: var(--font-ui); font-size: 0.86rem;
  overflow: hidden;
}
.menubar::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 0 14%, #60dd8e 24%, #3f9f7f 38%, #188a8d 52%, #17577e 66%, #141163 80%, transparent 92%);
  filter: blur(0.3px) drop-shadow(0 0 8px rgba(96,221,142,0.48)) drop-shadow(0 0 10px rgba(20,17,99,0.38));
  opacity: 0;
  transform: translateX(-120%);
  animation: menubar-electric 15.75s ease-in-out infinite;
}
@keyframes menubar-electric {
  0%, 68%, 100% { opacity: 0; transform: translateX(-120%); }
  72% { opacity: 0.95; }
  82% { opacity: 0.95; transform: translateX(120%); }
  86% { opacity: 0; transform: translateX(120%); }
}
.menubar-left, .menubar-right { display: flex; align-items: center; gap: 16px; }
.menubar-logo { height: 20px; width: auto; filter: drop-shadow(0 0 6px rgba(118,185,0,0.6)); }
.menubar-os { font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--green-bright); }
.menubar-app { color: var(--txt-dim); font-weight: 600; }
.menubar-right { font-family: var(--font-mono); font-size: 0.74rem; color: var(--txt-dim); }
.menubar-stat { display: flex; align-items: center; gap: 7px; }
.menubar-stat .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 8px var(--green); animation: blink 2.4s ease-in-out infinite; }
.menubar-clock { color: var(--txt); font-variant-numeric: tabular-nums; }
.mb-sep { width: 1px; height: 16px; background: var(--line); }
.os-switcher {
  display: none;
  align-items: center;
  gap: 4px;
  padding: 2px;
  border-radius: 9px;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--line-soft);
}
.os-switcher button {
  height: 24px;
  padding: 0 10px;
  border-radius: 7px;
  color: var(--txt-dim);
  font-family: var(--font-ui);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  white-space: nowrap;
  transition: background 0.16s, color 0.16s, box-shadow 0.16s;
}
.os-switcher button:hover {
  color: var(--txt);
  background: rgba(255,255,255,0.08);
}
.os-switcher button.is-active {
  color: #08120a;
  background: var(--green);
  box-shadow: var(--glow);
}
body.theme-mac-only .os-switcher button.is-active {
  color: #fff;
  background: #1d1d1f;
  box-shadow: 0 8px 20px rgba(29,29,31,0.18);
}
body.theme-windows-only .os-switcher button.is-active {
  color: #082f65;
  background: rgba(238,247,255,0.96);
  box-shadow: 0 10px 26px rgba(0, 120, 212, 0.26);
}
.os-switcher-sep { display: none; }
body.theme-dgx .os-switcher,
body.theme-mac-only .os-switcher,
body.theme-windows-only .os-switcher { display: flex; }
body.theme-dgx .os-switcher-sep,
body.theme-mac-only .os-switcher-sep,
body.theme-windows-only .os-switcher-sep { display: block; }
@keyframes blink { 50% { opacity: 0.45; } }
@media (max-width: 620px) { .menubar-date, .menubar-os { display: none; } }

/* =================================================================
   WINDOWS
   ================================================================= */
.win {
  position: absolute; z-index: 10;
  display: none; flex-direction: column;
  width: clamp(300px, 46vw, 620px);
  max-width: calc(100vw - 24px);
  height: clamp(320px, 70vh, 640px);
  max-height: calc(100% - 24px);
  background: var(--panel);
  backdrop-filter: blur(22px) saturate(150%); -webkit-backdrop-filter: blur(22px) saturate(150%);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-win);
  overflow: hidden;
  animation: winopen 0.26s cubic-bezier(0.2, 0.9, 0.3, 1);
}
.win.is-open { display: flex; }
.win.is-min { display: none; }
.win.is-minimizing {
  animation: win-minimize 0.24s cubic-bezier(0.35, 0, 0.2, 1) forwards;
  pointer-events: none;
}
.win.is-max {
  top: 0 !important; left: 0 !important;
  width: 100% !important; height: 100% !important;
  max-width: 100%; max-height: 100%;
  border-radius: 0; border-left: none; border-right: none;
}
.win.is-focused { box-shadow: 0 28px 70px -10px rgba(0,0,0,0.85), 0 0 0 1px var(--green), var(--glow); }
.win.is-focused .win-body {
  position: relative;
  isolation: isolate;
}
.win.is-focused .win-body::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  opacity: 0.08;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
  background-size: 180px 180px;
  animation: glass-noise-drift 14s steps(10) infinite;
}
.win.is-focused {
  -webkit-backdrop-filter: blur(26px) saturate(165%);
  backdrop-filter: blur(26px) saturate(165%);
}
@keyframes glass-noise-drift {
  to { background-position: 180px 120px; }
}

@keyframes winopen { from { opacity: 0; transform: scale(0.96) translateY(8px); } }
@keyframes win-minimize {
  to { opacity: 0; transform: translate3d(0, 36px, 0) scale(0.82); filter: blur(3px); }
}

.win-resize-handle {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 8;
  width: 18px;
  height: 18px;
  cursor: nwse-resize;
}
.win-resize-handle::before {
  content: "";
  position: absolute;
  right: 4px;
  bottom: 4px;
  width: 9px;
  height: 9px;
  border-right: 2px solid var(--green);
  border-bottom: 2px solid var(--green);
  opacity: 0.62;
}
.win.is-max .win-resize-handle {
  display: none;
}
.win.is-resizing {
  user-select: none;
}

.win-titlebar {
  display: flex; align-items: center; gap: 12px;
  height: 40px; padding: 0 12px; flex: 0 0 auto;
  background: var(--titlebar);
  border-bottom: 1px solid var(--line);
  cursor: grab; user-select: none;
}
.win-titlebar:active { cursor: grabbing; }
.win.is-max .win-titlebar { cursor: default; }

.win-lights { display: flex; gap: 8px; align-items: center; }
.win-light { width: 13px; height: 13px; border-radius: 50%; position: relative; transition: filter 0.15s; }
.win-light::after { content: ""; position: absolute; inset: 0; border-radius: 50%; opacity: 0; transition: opacity 0.15s; display:flex; }
.win-close { background: #ff5f57; }
.win-min   { background: var(--amber); }
.win-max   { background: var(--green); }
.win-lights:hover .win-light { filter: brightness(1.15); }
.win-close:hover { box-shadow: 0 0 8px #ff5f57; }
.win-min:hover  { box-shadow: 0 0 8px var(--amber); }
.win-max:hover  { box-shadow: 0 0 8px var(--green); }

.win-title {
  font-family: var(--font-ui); font-weight: 600; font-size: 0.92rem; letter-spacing: 0.04em;
  color: var(--txt); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  flex: 1; text-align: center;
}
.win-titlebar .win-ico { width: 16px; height: 16px; color: var(--green); flex: 0 0 auto; }

.win-body {
  flex: 1; overflow-y: auto; overflow-x: hidden;
  padding: 22px 24px calc(var(--dock-h) + 24px);
  scroll-behavior: smooth;
}

/* =================================================================
   CONTENT PRIMITIVES
   ================================================================= */
.h-title {
  font-family: var(--font-ui); font-weight: 700; letter-spacing: 0.04em;
  font-size: 1.5rem; color: var(--txt); display: flex; align-items: center; gap: 12px;
}
.h-title .accent { color: var(--green); }
.h-title::before {
  content: ""; width: 4px; height: 1.1em; border-radius: 4px;
  background: linear-gradient(var(--green-neon), var(--green)); box-shadow: var(--glow);
}
.h-sub {
  font-family: var(--font-ui); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase;
  font-size: 0.78rem; color: var(--green); margin: 26px 0 12px;
}
.lead { color: var(--txt-dim); line-height: 1.7; font-size: 0.95rem; }
.lead strong { color: var(--txt); font-weight: 600; }
.divider { height: 1px; background: var(--line); margin: 18px 0; }

.card {
  background: rgba(255,255,255,0.025);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-sm);
  padding: 16px 18px;
}

.btn {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-ui); font-weight: 600; letter-spacing: 0.04em;
  padding: 9px 16px; border-radius: 8px;
  background: rgba(118,185,0,0.12); color: var(--green-bright);
  border: 1px solid var(--line); transition: all 0.18s;
}
.btn:hover { background: var(--green); color: #08120a; box-shadow: var(--glow); text-decoration: none; }
.btn svg { width: 16px; height: 16px; }

.tag {
  display: inline-block; font-family: var(--font-mono); font-size: 0.72rem;
  padding: 3px 9px; border-radius: 6px; margin: 0 6px 6px 0;
  background: rgba(118,185,0,0.1); border: 1px solid var(--line); color: var(--green-bright);
}

/* ---------- About ---------- */
.about-head { display: flex; align-items: center; gap: 18px; margin-bottom: 8px; flex-wrap: wrap; }
.about-avatar {
  width: 92px; height: 92px; border-radius: 16px; object-fit: cover; flex: 0 0 auto;
  border: 2px solid var(--green); box-shadow: var(--glow); background: #0b0f0b;
}
.about-id .name { font-family: var(--font-ui); font-weight: 700; font-size: 1.9rem; line-height: 1; }
.about-id .role { color: var(--green-bright); font-family: var(--font-mono); font-size: 0.85rem; margin-top: 6px; }
.about-id .meta { color: var(--txt-faint); font-size: 0.8rem; margin-top: 4px; }

.goals { list-style: none; display: grid; gap: 8px; margin-top: 6px; }
.goals li { display: flex; align-items: center; gap: 10px; color: var(--txt-dim); font-size: 0.9rem; }
.goals .g-em { font-size: 1.05rem; }
.goals .g-val { margin-left: auto; font-family: var(--font-mono); color: var(--green-bright); font-size: 0.82rem; }

/* ---------- Experience timeline ---------- */
.xp-list { list-style: none; position: relative; }
.xp-item { position: relative; padding: 0 0 26px 56px; }
.xp-item::before { /* vertical line */
  content: ""; position: absolute; left: 19px; top: 6px; bottom: -6px; width: 2px;
  background: linear-gradient(var(--green), transparent);
}
.xp-item:last-child::before { display: none; }
.xp-logo {
  position: absolute; left: 0; top: 0; width: 40px; height: 40px; border-radius: 10px;
  background: #fff; display: flex; align-items: center; justify-content: center; overflow: hidden;
  border: 1px solid var(--line); padding: 5px;
}
.xp-logo img { width: 100%; height: 100%; object-fit: contain; }
.xp-logo.is-nvidia { background: #0a0f0a; padding: 4px; box-shadow: var(--glow); }
.xp-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.xp-role { font-family: var(--font-ui); font-weight: 700; font-size: 1.08rem; color: var(--txt); }
.xp-co { color: var(--green-bright); font-weight: 600; }
.xp-when { font-family: var(--font-mono); font-size: 0.74rem; color: var(--txt-faint); margin-top: 2px; }
.xp-when .now { color: var(--green); }
.xp-body { color: var(--txt-dim); font-size: 0.9rem; line-height: 1.6; margin-top: 8px; }
.xp-team { font-family: var(--font-ui); font-weight: 700; color: var(--green-bright); font-size: 0.95rem; margin-bottom: 6px; }
.xp-body ul { list-style: none; display: grid; gap: 5px; }
.xp-body li { position: relative; padding-left: 16px; }
.xp-body li::before { content: "▸"; position: absolute; left: 0; color: var(--green); }
.xp-current {
  display: inline-block; font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.12em;
  text-transform: uppercase; padding: 2px 8px; border-radius: 20px; vertical-align: middle;
  background: rgba(118,185,0,0.18); border: 1px solid var(--green); color: var(--green-neon);
}

/* ---------- Skills / progress ---------- */
.skills-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 26px; }
.skill { margin-bottom: 12px; }
.skill-top { display: flex; justify-content: space-between; font-size: 0.85rem; margin-bottom: 6px; }
.skill-top b { font-family: var(--font-ui); font-weight: 600; color: var(--txt); }
.skill-top span { font-family: var(--font-mono); font-size: 0.74rem; color: var(--green-bright); }
.skill-bar { height: 7px; border-radius: 6px; background: rgba(255,255,255,0.07); overflow: hidden; }
.skill-fill { height: 100%; width: 0; border-radius: 6px; background: linear-gradient(90deg, var(--green), var(--green-neon)); box-shadow: 0 0 8px rgba(118,185,0,0.5); transition: width 1.1s cubic-bezier(0.2,0.8,0.2,1); }

.tech-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 12px; }
.tech-grid a {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 12px 6px; border-radius: 10px; background: rgba(255,255,255,0.025);
  border: 1px solid var(--line-soft); transition: all 0.18s; text-decoration: none;
}
.tech-grid a:hover { border-color: var(--green); background: rgba(118,185,0,0.1); transform: translateY(-3px); box-shadow: var(--glow); }
.tech-grid img { width: 34px; height: 34px; object-fit: contain; }
.tech-grid span { font-size: 0.68rem; color: var(--txt-faint); font-family: var(--font-mono); }

/* ---------- Projects ---------- */
.filters { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.filter-btn {
  font-family: var(--font-ui); font-weight: 600; letter-spacing: 0.05em;
  padding: 6px 16px; border-radius: 20px; color: var(--txt-dim);
  border: 1px solid var(--line-soft); transition: all 0.16s;
}
.filter-btn:hover { color: var(--green-bright); border-color: var(--line); }
.filter-btn.active { background: var(--green); color: #08120a; border-color: var(--green); }

.proj-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.proj {
  border: 1px solid var(--line-soft); border-radius: var(--radius-sm); overflow: hidden;
  background: rgba(255,255,255,0.02); transition: all 0.2s; display: flex; flex-direction: column;
}
.proj.is-hidden { display: none; }
.proj:hover { transform: translateY(-4px); border-color: var(--green); box-shadow: var(--shadow-win); }
.proj-img { aspect-ratio: 16/10; overflow: hidden; background: #0a0d0a; }
.proj-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; }
.proj:hover .proj-img img { transform: scale(1.06); }
.proj-info { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.proj-info h4 { font-family: var(--font-ui); font-weight: 700; font-size: 0.98rem; }
.proj-info .cat { color: var(--txt-faint); font-size: 0.76rem; }
.proj-info .stack { font-family: var(--font-mono); font-size: 0.72rem; color: var(--green-bright); margin-top: 2px; }
.proj-info .btn { margin-top: auto; align-self: flex-start; padding: 6px 12px; font-size: 0.82rem; }

/* ---------- Certificates ---------- */
.cert-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 16px; }
.cert {
  border: 1px solid var(--line-soft); border-radius: var(--radius-sm); overflow: hidden;
  background: rgba(255,255,255,0.02); transition: all 0.18s;
}
.cert:hover { border-color: var(--green); box-shadow: var(--shadow-win); }
.cert img { width: 100%; aspect-ratio: 4/3; object-fit: cover; cursor: zoom-in; background: #0a0d0a; }
.cert-cap { padding: 10px 12px; }
.cert-cap h4 { font-size: 0.86rem; font-weight: 600; line-height: 1.3; }
.cert-cap h4 a { color: var(--txt); }
.cert-cap p { font-size: 0.74rem; color: var(--txt-faint); margin-top: 3px; font-family: var(--font-mono); }

/* ---------- Side projects / blog cards ---------- */
.side-card { display: flex; gap: 16px; flex-wrap: wrap; }
.side-card .banner { flex: 0 0 200px; max-width: 200px; border-radius: var(--radius-sm); overflow: hidden; border: 1px solid var(--line-soft); }
.side-card .banner img { width: 100%; height: 100%; object-fit: cover; }
.side-card .body { flex: 1; min-width: 220px; }

/* ---------- Contact ---------- */
.copy-field {
  display: flex; align-items: center; gap: 10px;
  background: rgba(0,0,0,0.4); border: 1px solid var(--line);
  border-radius: 8px; padding: 6px 6px 6px 14px; font-family: var(--font-mono);
}
.copy-field .val { flex: 1; color: var(--txt); font-size: 0.9rem; overflow: hidden; text-overflow: ellipsis; }
.copy-field .copy-btn {
  padding: 7px 14px; border-radius: 6px; background: var(--green); color: #08120a;
  font-family: var(--font-ui); font-weight: 700; letter-spacing: 0.05em; transition: all 0.15s; flex: 0 0 auto;
}
.copy-field .copy-btn:hover { box-shadow: var(--glow); }
.socials { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 6px; }
.socials a {
  width: 52px; height: 52px; border-radius: 12px; display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.03); border: 1px solid var(--line-soft); transition: all 0.18s;
}
.socials a:hover { border-color: var(--green); background: rgba(118,185,0,0.12); transform: translateY(-3px); box-shadow: var(--glow); }
.socials svg, .socials img { width: 24px; height: 24px; color: var(--green-bright); }
.toast {
  position: fixed; bottom: calc(var(--dock-h) + 18px); left: 50%; transform: translateX(-50%) translateY(20px);
  background: var(--green); color: #08120a; font-family: var(--font-ui); font-weight: 700;
  padding: 10px 20px; border-radius: 10px; box-shadow: var(--glow); z-index: 9000;
  opacity: 0; transition: all 0.3s; pointer-events: none; letter-spacing: 0.04em;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

.notification-stack {
  position: fixed;
  right: 16px;
  bottom: calc(var(--dock-h) + 18px);
  z-index: 9100;
  display: grid;
  gap: 10px;
  width: min(320px, calc(100vw - 32px));
  pointer-events: none;
}
.notification {
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(12, 16, 12, 0.88);
  border: 1px solid var(--line);
  box-shadow: 0 18px 44px rgba(0,0,0,0.34), inset 0 1px 0 rgba(255,255,255,0.06);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
  backdrop-filter: blur(18px) saturate(150%);
  opacity: 0;
  transform: translateX(18px);
  transition: opacity 0.2s, transform 0.2s;
}
.notification.show {
  opacity: 1;
  transform: translateX(0);
}
.notification b {
  display: block;
  color: var(--txt);
  font: 800 0.9rem var(--font-ui);
}
.notification span {
  display: block;
  margin-top: 3px;
  color: var(--txt-faint);
  font-size: 0.78rem;
}

.desktop-widgets {
  position: absolute;
  top: calc(var(--menubar-h) + 18px);
  right: 18px;
  z-index: 6;
  display: grid;
  gap: 10px;
  width: 188px;
}
.desktop-widget {
  min-height: 86px;
  padding: 11px 12px;
  border-radius: 10px;
  color: var(--txt);
  text-align: left;
  background: rgba(12, 16, 12, 0.52);
  border: 1px solid var(--line-soft);
  box-shadow: 0 18px 44px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.06);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
  cursor: grab;
}
.desktop-widget:active { cursor: grabbing; }
.desktop-widget:hover {
  border-color: var(--line);
  box-shadow: 0 22px 52px rgba(0,0,0,0.34), var(--glow);
}
.widget-kicker {
  display: block;
  color: var(--txt-faint);
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.desktop-widget strong {
  display: block;
  margin-top: 3px;
  color: var(--txt);
  font: 800 1rem var(--font-ui);
}
.desktop-widget span:not(.widget-kicker) {
  display: block;
  color: var(--green-bright);
  font-size: 0.76rem;
  font-weight: 700;
}
.desktop-widget svg {
  width: 100%;
  height: 38px;
  margin-top: 5px;
}
.widget-bars {
  display: grid;
  gap: 5px;
  margin-top: 10px;
}
.widget-bars i {
  display: block;
  height: 5px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--green), var(--green-neon));
  opacity: 0.72;
}
.widget-bars i:nth-child(1) { width: 88%; }
.widget-bars i:nth-child(2) { width: 70%; }
.widget-bars i:nth-child(3) { width: 96%; }

.overlay-shell,
.search-shell {
  width: min(920px, calc(100vw - 32px));
  max-height: min(720px, calc(100vh - 72px));
  border-radius: 16px;
  background: rgba(11, 15, 12, 0.78);
  border: 1px solid var(--line);
  box-shadow: 0 32px 90px rgba(0,0,0,0.52), inset 0 1px 0 rgba(255,255,255,0.08);
  -webkit-backdrop-filter: blur(28px) saturate(160%);
  backdrop-filter: blur(28px) saturate(160%);
  overflow: hidden;
}
.mission-control,
.universal-search,
.app-launcher,
.command-palette {
  position: fixed;
  inset: 0;
  z-index: 9200;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(0,0,0,0.36);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.18s, visibility 0.18s;
}
.mission-control.is-open,
.universal-search.is-open,
.app-launcher.is-open,
.command-palette.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.overlay-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line-soft);
}
.overlay-head span {
  display: block;
  color: var(--txt-faint);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.overlay-head strong {
  display: block;
  margin-top: 2px;
  color: var(--txt);
  font: 800 1.1rem var(--font-ui);
}
.overlay-head button {
  padding: 7px 12px;
  border-radius: 8px;
  color: var(--txt);
  background: rgba(255,255,255,0.07);
  border: 1px solid var(--line-soft);
}
.mission-grid,
.launcher-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  padding: 16px;
  max-height: calc(100vh - 170px);
  overflow: auto;
}
.mission-card,
.launcher-tile,
.search-result-row {
  border-radius: 10px;
  background: rgba(255,255,255,0.055);
  border: 1px solid var(--line-soft);
  color: var(--txt);
  text-align: left;
}
.mission-card {
  min-height: 124px;
  padding: 10px;
}
.mission-card:hover,
.launcher-tile:hover,
.search-result-row:hover,
.search-result-row.is-active {
  border-color: var(--line);
  background: rgba(118,185,0,0.12);
}
.mission-card .mini-window {
  height: 72px;
  border-radius: 7px;
  background: linear-gradient(145deg, rgba(118,185,0,0.18), rgba(255,255,255,0.08));
  border: 1px solid var(--line-soft);
  position: relative;
  overflow: hidden;
}
.mission-card .mini-window::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 16px;
  background: rgba(255,255,255,0.12);
}
.mission-card b,
.launcher-tile b,
.search-result-row b {
  display: block;
  margin-top: 9px;
  font-size: 0.88rem;
}
.mission-card span,
.launcher-tile span,
.search-result-row span {
  display: block;
  margin-top: 2px;
  color: var(--txt-faint);
  font-size: 0.72rem;
}
.launcher-tile {
  min-height: 104px;
  padding: 14px;
}
.launcher-tile svg,
.search-result-row svg {
  width: 24px;
  height: 24px;
  color: var(--green-bright);
}
.search-shell {
  width: min(680px, calc(100vw - 28px));
}
.search-input-row {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 58px;
  padding: 0 16px;
}
.search-input-row svg {
  width: 22px;
  height: 22px;
  color: var(--green-bright);
}
.search-input-row input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--txt);
  font: 700 1rem var(--font-body);
}
.search-results {
  border-top: 1px solid var(--line-soft);
  max-height: min(420px, 54vh);
  overflow: auto;
  padding: 8px;
}
.search-result-row {
  width: 100%;
  min-height: 56px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 10px;
}
.search-result-row > div {
  min-width: 0;
}
.command-shell {
  border-color: rgba(118,185,0,0.34);
  box-shadow: 0 0 0 1px rgba(118,185,0,0.14), 0 32px 90px rgba(0,0,0,0.58), var(--glow);
}
.snap-preview {
  position: fixed;
  z-index: 580;
  border: 2px solid var(--green-bright);
  border-radius: 12px;
  background: rgba(118,185,0,0.13);
  box-shadow: var(--glow);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.12s;
}
.snap-preview.is-visible {
  opacity: 1;
}

/* =================================================================
   TERMINAL
   ================================================================= */
.win[data-app="terminal"] .win-body { padding: 0; background: rgba(4, 6, 4, 0.84); }
.term {
  height: 100%; display: flex; flex-direction: column;
  font-family: var(--font-mono); font-size: 0.85rem; line-height: 1.55;
}
.term-output { flex: 1; overflow-y: auto; padding: 16px 18px 8px; color: #cfe8c0; }
.term-output .ln { white-space: pre-wrap; word-break: break-word; }
.term-output .green { color: var(--green-neon); }
.term-output .dim { color: var(--txt-faint); }
.term-output .err { color: #ff7a7a; }
.term-output .cmd { color: #fff; }
.term-output a { color: var(--green-neon); text-decoration: underline; }
.term-art { color: var(--green); display: block; line-height: 1.15; font-size: 0.74rem; }
.term-inputline { display: flex; align-items: center; gap: 8px; padding: 8px 18px 16px; }
.term-prompt { color: var(--green); white-space: nowrap; }
.term-input {
  flex: 1; background: none; border: none; color: #fff;
  font-family: var(--font-mono); font-size: 0.85rem; caret-color: var(--green-neon);
}

/* =================================================================
   GPU STATS PANEL (nvidia-smi style)
   ================================================================= */
.gpu { display: flex; flex-direction: column; gap: 18px; font-family: var(--font-mono); }
.gpu-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.gpu-head .name { font-family: var(--font-ui); font-weight: 700; font-size: 1.1rem; color: var(--txt); }
.gpu-head .name span { color: var(--green); }
.gpu-sub { font-family: var(--font-mono); font-size: 0.72rem; color: var(--green-bright); margin-top: 3px; }
.gpu-head .badge { font-size: 0.7rem; color: var(--green-bright); border: 1px solid var(--line); padding: 3px 10px; border-radius: 20px; }
.gauges { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 16px; }
.gauge { background: rgba(0,0,0,0.35); border: 1px solid var(--line-soft); border-radius: 10px; padding: 14px; }
.gauge .lbl { font-size: 0.7rem; color: var(--txt-faint); letter-spacing: 0.1em; text-transform: uppercase; }
.gauge .num { font-size: 1.6rem; font-weight: 700; color: var(--green-neon); margin: 4px 0 8px; font-variant-numeric: tabular-nums; }
.gauge .num small { font-size: 0.8rem; color: var(--txt-dim); }
.gauge-bar { height: 6px; border-radius: 6px; background: rgba(255,255,255,0.08); overflow: hidden; }
.gauge-fill { height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--green), var(--green-neon)); transition: width 0.6s ease; }
.gpu-procs { background: rgba(0,0,0,0.4); border: 1px solid var(--line-soft); border-radius: 10px; padding: 12px 14px; }
.gpu-procs h5 { font-family: var(--font-ui); font-size: 0.78rem; color: var(--txt-dim); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 8px; }
.gpu-procs .row { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; font-size: 0.78rem; color: var(--txt-dim); padding: 4px 0; border-top: 1px dashed var(--line-soft); }
.gpu-procs .row:first-of-type { border-top: none; color: var(--txt-faint); }
.gpu-procs .row b { color: var(--txt); font-weight: 500; }
.gpu-procs .row .g { color: var(--green-bright); }

/* =================================================================
   GITHUB + DIAGNOSTICS APPS
   ================================================================= */
.github-app,
.diag-app {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.github-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.github-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.github-stats > div,
.diag-card {
  min-width: 0;
  padding: 12px;
  border-radius: 10px;
  background: rgba(0,0,0,0.26);
  border: 1px solid var(--line-soft);
}
.github-stats span {
  display: block;
  color: var(--green-neon);
  font: 800 1.45rem var(--font-ui);
}
.github-stats b {
  color: var(--txt-faint);
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.github-repos {
  display: grid;
  gap: 10px;
}
.github-repo {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px 12px;
  padding: 12px;
  border-radius: 10px;
  background: rgba(255,255,255,0.035);
  border: 1px solid var(--line-soft);
}
.github-repo b {
  color: var(--txt);
}
.github-repo p,
.github-repo span {
  grid-column: 1 / -1;
  color: var(--txt-faint);
  font-size: 0.78rem;
  line-height: 1.45;
}
.github-repo em {
  color: var(--green-bright);
  font: 700 0.72rem var(--font-mono);
  font-style: normal;
  justify-self: end;
}
.skeleton-row {
  height: 56px;
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(255,255,255,0.04), rgba(255,255,255,0.1), rgba(255,255,255,0.04));
  background-size: 180% 100%;
  animation: skeleton-scan 1.4s linear infinite;
}
@keyframes skeleton-scan { to { background-position: -180% 0; } }
.diag-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.diag-card {
  position: relative;
  overflow: hidden;
}
.diag-card span {
  display: block;
  color: var(--txt-faint);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.diag-card strong {
  display: block;
  margin-top: 6px;
  color: var(--green-neon);
  font: 800 1.15rem var(--font-ui);
}
.diag-card i {
  display: block;
  height: 5px;
  margin-top: 11px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--green), var(--green-neon));
  transform-origin: left center;
  animation: diag-pulse 2.4s ease-in-out infinite;
}
.diag-log {
  display: grid;
  gap: 4px;
  padding: 12px;
  border-radius: 10px;
  background: rgba(0,0,0,0.36);
  border: 1px solid var(--line-soft);
  font-family: var(--font-mono);
}
.diag-log div {
  display: grid;
  grid-template-columns: 72px 1fr auto;
  gap: 10px;
  color: var(--txt-dim);
  font-size: 0.75rem;
}
.diag-log b {
  color: var(--green-bright);
  font-weight: 500;
}
.diag-log em {
  color: var(--green-neon);
  font-style: normal;
}
@keyframes diag-pulse {
  0%, 100% { transform: scaleX(0.68); opacity: 0.55; }
  50% { transform: scaleX(1); opacity: 0.95; }
}

/* =================================================================
   DOCK
   ================================================================= */
.dock {
  position: fixed; left: 50%; bottom: 12px; transform: translateX(-50%); z-index: 600;
  max-width: calc(100vw - 16px);
  overflow: visible;
}
.dock-inner {
  display: flex; align-items: flex-end; gap: 8px; padding: 8px 12px;
  background: rgba(10, 13, 10, 0.6);
  backdrop-filter: blur(20px) saturate(160%); -webkit-backdrop-filter: blur(20px) saturate(160%);
  border: 1px solid var(--line); border-radius: 18px;
  box-shadow: 0 16px 40px -8px rgba(0,0,0,0.7), inset 0 1px 0 rgba(255,255,255,0.05);
  overflow: visible;
}

/* Solid fallback where backdrop-filter is unsupported */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .dock-inner { background: rgba(10, 13, 10, 0.92); }
  .menubar    { background: rgba(8, 10, 8, 0.95); }
  .win        { background: var(--panel-solid); }
}
.dock-item {
  position: relative; flex: 0 0 auto;
  width: 50px; height: 50px; border-radius: 13px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(160deg, rgba(118,185,0,0.16), rgba(118,185,0,0.04));
  border: 1px solid var(--line-soft);
  transition: transform 0.18s cubic-bezier(0.2,0.9,0.2,1.4), background 0.18s, box-shadow 0.18s;
}
.dock-item:hover { transform: translateY(-12px) scale(1.18); background: linear-gradient(160deg, rgba(118,185,0,0.32), rgba(118,185,0,0.1)); box-shadow: var(--glow); }
.dock-item:active { transform: translateY(-6px) scale(1.08); }
.dock-item svg { width: 26px; height: 26px; color: var(--green-neon); }
.dock-item img { width: 28px; height: 28px; object-fit: contain; }
.dock-indicator { position: absolute; bottom: -5px; left: 50%; transform: translateX(-50%); width: 4px; height: 4px; border-radius: 50%; background: var(--green-neon); box-shadow: 0 0 6px var(--green); opacity: 0; transition: opacity 0.2s; }
.dock-item.is-open .dock-indicator { opacity: 1; }
.dock-tooltip {
  position: absolute; bottom: calc(100% + 12px); left: 50%; transform: translateX(-50%) translateY(6px);
  background: var(--panel-solid); border: 1px solid var(--line); color: var(--txt);
  font-family: var(--font-ui); font-weight: 600; font-size: 0.78rem; letter-spacing: 0.04em;
  padding: 5px 11px; border-radius: 7px; white-space: nowrap; opacity: 0; pointer-events: none;
  transition: opacity 0.16s, transform 0.16s;
}
.dock-item:hover .dock-tooltip { opacity: 1; transform: translateX(-50%) translateY(0); }
.dock-sep { width: 1px; align-self: center; height: 32px; background: var(--line); margin: 0 4px; flex: 0 0 auto; }
.stock-dock-widget {
  width: 92px;
  gap: 7px;
  padding: 0 9px;
  justify-content: flex-start;
}
.stock-widget-icon {
  width: 38px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.stock-widget-icon svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}
.stock-grid-line {
  fill: none;
  stroke: rgba(255,255,255,0.16);
  stroke-width: 1;
}
[data-stock-sparkline] {
  fill: none;
  stroke: var(--green-bright);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 6px rgba(118,185,0,0.52));
}
.stock-candle-mark {
  fill: rgba(118,185,0,0.24);
  stroke: #eaffda;
  stroke-width: 2;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 7px rgba(118,185,0,0.62));
}
.stock-widget-meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  line-height: 1;
}
.stock-widget-meta b {
  color: var(--txt);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.03em;
}
.stock-widget-meta span {
  color: #8cff65;
  font-size: 0.66rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.stock-widget-meta span.is-down,
.stock-is-down [data-stock-sparkline],
.stock-is-down .stock-candle-mark {
  color: #ff5f57;
  stroke: #ff7f7a;
}
.stock-is-down .stock-candle-mark {
  fill: rgba(255,95,87,0.22);
}
body.theme-dgx.dock-left .stock-dock-widget,
body.theme-dgx.dock-right .stock-dock-widget {
  width: 50px;
  height: 66px;
  padding: 6px;
  flex-direction: column;
  gap: 3px;
  justify-content: center;
}
body.theme-dgx.dock-left .stock-widget-meta,
body.theme-dgx.dock-right .stock-widget-meta {
  align-items: center;
}
body.theme-dgx.dock-left .stock-widget-meta span,
body.theme-dgx.dock-right .stock-widget-meta span {
  display: none;
}

.windows-taskbar {
  display: none;
}

body.theme-dgx.dock-left .dock,
body.theme-dgx.dock-right .dock {
  top: 50%;
  bottom: auto;
  max-width: none;
  transform: translateY(-50%);
}
body.theme-dgx.dock-left .dock {
  left: 12px;
  right: auto;
}
body.theme-dgx.dock-right .dock {
  left: auto;
  right: 12px;
}
body.theme-dgx.dock-left .dock-inner,
body.theme-dgx.dock-right .dock-inner {
  flex-direction: column;
  align-items: center;
  max-height: calc(100vh - 78px);
  overflow: visible;
}
body.theme-dgx.dock-left .dock-sep,
body.theme-dgx.dock-right .dock-sep {
  width: 32px;
  height: 1px;
  margin: 4px 0;
}
body.theme-dgx.dock-left .dock-tooltip,
body.theme-dgx.dock-right .dock-tooltip {
  top: 50%;
  bottom: auto;
}
body.theme-dgx.dock-left .dock-tooltip {
  left: calc(100% + 12px);
  transform: translateY(-50%) translateX(-6px);
}
body.theme-dgx.dock-right .dock-tooltip {
  left: auto;
  right: calc(100% + 12px);
  transform: translateY(-50%) translateX(6px);
}
body.theme-dgx.dock-left .dock-item:hover .dock-tooltip,
body.theme-dgx.dock-left .dock-item.tooltip-demo .dock-tooltip,
body.theme-dgx.dock-right .dock-item:hover .dock-tooltip,
body.theme-dgx.dock-right .dock-item.tooltip-demo .dock-tooltip {
  transform: translateY(-50%) translateX(0);
}

.taskbar-context-menu {
  position: fixed;
  z-index: 9500;
  min-width: 148px;
  padding: 6px;
  border-radius: 9px;
  background: rgba(20, 24, 30, 0.92);
  border: 1px solid rgba(255,255,255,0.13);
  box-shadow: 0 18px 46px rgba(0,0,0,0.32);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
  backdrop-filter: blur(18px) saturate(150%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(5px);
  transition: opacity 0.12s, transform 0.12s, visibility 0.12s;
}
.taskbar-context-menu.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}
.taskbar-context-menu button {
  display: block;
  width: 100%;
  height: 34px;
  padding: 0 10px;
  border-radius: 7px;
  color: rgba(247,251,255,0.88);
  font: 700 0.78rem var(--font-ui);
  text-align: left;
}
.taskbar-context-menu button:hover,
.taskbar-context-menu button.is-active {
  color: #07120a;
  background: var(--green);
}

/* =================================================================
   SPLIT OS PRE-COLLISION SKIN
   ================================================================= */
body.theme-macos {
  --green: #76B900;
  --green-bright: #76B900;
  --green-neon: #76B900;
  --green-dim: #4d7a00;
  --bg-0: #eff4ff;
  --bg-1: #dce7ff;
  --panel: rgba(250, 252, 255, 0.62);
  --panel-solid: #f6f8fc;
  --panel-2: #eef2f8;
  --titlebar: rgba(242, 245, 250, 0.64);
  --line: rgba(36, 50, 74, 0.16);
  --line-soft: rgba(36, 50, 74, 0.10);
  --txt: #1d1d1f;
  --txt-dim: #4b5565;
  --txt-faint: #6e7480;
  --glow: 0 12px 36px rgba(118, 185, 0, 0.22);
  --shadow-win: 0 26px 70px -24px rgba(36, 50, 74, 0.58),
                0 0 0 1px rgba(255, 255, 255, 0.58);
  background: linear-gradient(90deg, #eff4ff 0 50%, #071839 50% 100%);
}
body.theme-macos .desktop { margin-top: 0; }

body.theme-macos .boot {
  background:
    radial-gradient(circle at 24% 35%, rgba(247,185,210,0.42), transparent 30%),
    radial-gradient(circle at 76% 42%, rgba(0,120,212,0.50), transparent 33%),
    linear-gradient(90deg, #f8fbff 0 50%, #071839 50% 100%);
  color: #1d1d1f;
}
body.theme-macos .boot-logo {
  position: relative;
  width: 132px;
  height: 84px;
  border-radius: 22px;
  display: block;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(255,255,255,0.68) 0 50%, rgba(16,87,195,0.34) 50% 100%);
  border: 1px solid rgba(255,255,255,0.72);
  box-shadow: 0 22px 55px rgba(36, 50, 74, 0.22), inset 0 1px 0 rgba(255,255,255,0.8);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
  backdrop-filter: blur(18px) saturate(150%);
}
.split-logo-half {
  display: none;
}
body.theme-macos .split-logo-half {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50%;
  overflow: hidden;
}
body.theme-macos .split-logo-apple {
  left: 0;
}
body.theme-macos .split-logo-msft {
  right: 0;
}
body.theme-macos .split-logo-half img {
  display: block;
  position: absolute;
  top: 50%;
  max-width: none;
  transform: translate(-50%, -50%);
}
body.theme-macos .split-logo-apple img {
  left: 100%;
  width: 44px;
}
body.theme-macos .split-logo-msft img {
  left: 0;
  width: 54px;
}
body.theme-macos .boot-logo::after {
  content: "";
  position: absolute;
  top: 14px;
  bottom: 14px;
  left: 50%;
  width: 1px;
  background: linear-gradient(transparent, rgba(255,255,255,0.62), transparent);
}
body.theme-macos .boot-title {
  background: linear-gradient(90deg, #1d1d1f 0 50%, #f8fbff 50% 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-family: var(--font-body);
  font-size: 1.6rem;
  letter-spacing: 0.02em;
  padding-left: 0;
  text-transform: none;
}
body.theme-macos .boot-sub,
body.theme-macos .boot-hint {
  background: linear-gradient(90deg, rgba(29,29,31,0.62) 0 50%, rgba(248,251,255,0.62) 50% 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
body.theme-macos .boot-bar { background: rgba(29, 29, 31, 0.11); }
body.theme-macos .boot-bar-fill {
  background: linear-gradient(90deg, #76B900, #76B900);
  box-shadow: 0 0 18px rgba(118, 185, 0, 0.36);
}

body.theme-macos .desktop-video { opacity: 0; }
body.theme-macos .desktop-bg::before {
  top: -12%;
  right: 50%;
  bottom: -12%;
  left: -12%;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.04), rgba(218,231,255,0.10)),
    url("../images/macos_bg.jpg") left center / cover no-repeat;
  filter: saturate(1.12) contrast(1.02) brightness(1.04);
  animation: macos-wallpaper 30s ease-in-out infinite alternate;
}
body.theme-macos .desktop-bg::after {
  content: "";
  position: absolute;
  top: -12%;
  right: -12%;
  bottom: -12%;
  left: 50%;
  background:
    linear-gradient(180deg, rgba(8, 24, 54, 0.06), rgba(3, 10, 28, 0.14)),
    url("../images/window-11-bg.jpg") right center / cover no-repeat;
  border-left: 1px solid rgba(255,255,255,0.52);
  filter: saturate(1.06) contrast(1.02);
  animation: windows-wallpaper 34s ease-in-out infinite alternate;
}
body.theme-macos .desktop-watermark > img { display: none; }
body.theme-macos .desktop-split-logo {
  width: 132px;
  height: 96px;
  border-radius: 24px;
  display: block;
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(90deg, rgba(255,255,255,0.24) 0 50%, rgba(0,120,212,0.18) 50% 100%);
  border: 1px solid rgba(255,255,255,0.32);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.35);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
body.theme-macos .desktop-split-logo::after {
  content: "";
  position: absolute;
  top: 14px;
  bottom: 14px;
  left: 50%;
  width: 1px;
  background: linear-gradient(transparent, rgba(255,255,255,0.42), transparent);
  pointer-events: none;
}
body.theme-macos .desktop-split-logo .split-logo-apple img {
  width: 52px;
}
body.theme-macos .desktop-split-logo .split-logo-msft img {
  width: 58px;
}
body.theme-macos .desktop-watermark p {
  color: rgba(248, 251, 255, 0.72);
  opacity: 1;
  text-shadow: 0 1px 12px rgba(0,0,0,0.38);
}

body.theme-macos .menubar {
  right: 50%;
  background: rgba(247, 249, 253, 0.76);
  border-bottom: 1px solid rgba(36, 50, 74, 0.12);
  border-right: 1px solid rgba(255, 255, 255, 0.52);
  box-shadow: 0 1px 14px rgba(36, 50, 74, 0.10);
  color: #1d1d1f;
  font-family: var(--font-body);
  -webkit-backdrop-filter: blur(22px) saturate(180%);
  backdrop-filter: blur(22px) saturate(180%);
}
body.theme-macos .menubar-left,
body.theme-macos .menubar-right { gap: 14px; }
body.theme-macos .menubar-left::before {
  content: "";
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  background: url("../images/apple-logo.svg") center / contain no-repeat;
}
body.theme-macos .menubar-left::after {
  content: "File Edit View Window Help";
  color: #2d3340;
  font-size: 0.79rem;
  word-spacing: 0.7em;
  white-space: nowrap;
}
body.theme-macos .menubar-logo,
body.theme-macos .menubar-os { display: none; }
body.theme-macos .menubar-app {
  color: #1d1d1f;
  font-weight: 700;
}
body.theme-macos .menubar-right {
  display: flex;
  margin-left: auto;
  color: #2d3340;
  font-family: var(--font-body);
  font-size: 0.78rem;
}
body.theme-macos .menubar-stat,
body.theme-macos .menubar-right .mb-sep { display: none; }
body.theme-macos .menubar-clock { color: #1d1d1f; }

body.theme-macos .win {
  background: var(--panel);
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 10px;
  box-shadow: var(--shadow-win);
  color: var(--txt);
}
body.theme-macos .win.is-focused {
  box-shadow: 0 30px 76px -22px rgba(36, 50, 74, 0.68), 0 0 0 1px rgba(118, 185, 0, 0.36);
}
body.theme-macos .win-titlebar {
  background: var(--titlebar);
  border-bottom: 1px solid rgba(36, 50, 74, 0.10);
}
body.theme-macos .win-title {
  color: #1d1d1f;
  font-family: var(--font-body);
  letter-spacing: 0;
}
body.theme-macos .win-titlebar .win-ico { color: #5d6675; }
body.theme-macos .win-body { color: var(--txt); }

body.theme-macos .dock-inner {
  background: rgba(255,255,255,0.48);
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 22px;
  box-shadow: 0 26px 60px -18px rgba(36, 50, 74, 0.46), inset 0 1px 0 rgba(255,255,255,0.72);
  -webkit-backdrop-filter: blur(26px) saturate(180%);
  backdrop-filter: blur(26px) saturate(180%);
}
body.theme-macos .dock-item {
  background: linear-gradient(135deg, rgba(255,255,255,0.64), rgba(236,244,255,0.34));
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.72), 0 8px 20px rgba(36, 50, 74, 0.14);
}
body.theme-macos .dock-item:hover {
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 16px 30px rgba(36, 50, 74, 0.20);
}
body.theme-macos .dock-item svg { color: #263244; }
body.theme-mac-only .dock-item:nth-of-type(1) svg { color: #007aff; }
body.theme-mac-only .dock-item:nth-of-type(2) svg { color: #ff9f0a; }
body.theme-mac-only .dock-item:nth-of-type(3) svg { color: #af52de; }
body.theme-mac-only .dock-item:nth-of-type(4) svg { color: #0a84ff; }
body.theme-mac-only .dock-item:nth-of-type(5) svg { color: #ff453a; }
body.theme-mac-only .dock-item:nth-of-type(6) svg { color: #ff375f; }
body.theme-mac-only .dock-item:nth-of-type(7) svg { color: #5e5ce6; }
body.theme-mac-only .dock-item:nth-of-type(8) svg { color: #64d2ff; }
body.theme-mac-only .dock-item:nth-of-type(9) svg { color: #0a84ff; }
body.theme-macos .dock-indicator {
  background: rgba(29, 29, 31, 0.68);
  box-shadow: none;
}
body.theme-macos .dock-tooltip {
  background: rgba(255,255,255,0.92);
  border-color: rgba(36, 50, 74, 0.12);
  color: #1d1d1f;
  font-family: var(--font-body);
  letter-spacing: 0;
  box-shadow: 0 12px 30px rgba(36, 50, 74, 0.18);
}

body.theme-macos .dock {
  left: 0;
  right: 50%;
  bottom: 0;
  height: 76px;
  max-width: none;
  transform: none;
  pointer-events: none;
}
body.theme-macos .dock::before,
body.theme-macos .dock::after { content: none; }
body.theme-macos .dock-inner {
  position: absolute;
  left: max(14px, calc(25vw - 250px));
  bottom: 10px;
  width: min(500px, calc(50vw - 28px));
  pointer-events: auto;
}

body.theme-macos .windows-taskbar {
  position: fixed;
  right: 0;
  bottom: 0;
  z-index: 610;
  width: 50%;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 8px 14px;
  color: #f7fbff;
  background: rgba(16, 48, 92, 0.66);
  border-top: 1px solid rgba(255,255,255,0.20);
  box-shadow: 0 -18px 48px rgba(0,0,0,0.24), inset 0 1px 0 rgba(255,255,255,0.08);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
  backdrop-filter: blur(24px) saturate(160%);
  font-family: "Segoe UI", var(--font-body);
  user-select: none;
}
body.theme-macos .windows-taskbar .win-taskbar-left {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
body.theme-macos .windows-taskbar .win-taskbar-tray {
  position: absolute;
  right: 14px;
}

body.theme-mac-only .menubar {
  right: 0;
  border-right: none;
}
body.theme-mac-only {
  --green: #0a84ff;
  --green-bright: #0a84ff;
  --green-neon: #64d2ff;
  --green-dim: #2563eb;
  --glow: 0 12px 32px rgba(10, 132, 255, 0.20);
}
body.theme-mac-only .win-close { background: #ff5f57; }
body.theme-mac-only .win-min { background: #ffbd2e; }
body.theme-mac-only .win-max { background: #28c840; }
body.theme-mac-only .desktop-bg::before {
  right: -12%;
}
body.theme-mac-only .desktop-bg::after,
body.theme-mac-only .windows-taskbar,
body.theme-mac-only .desktop-split-logo {
  display: none;
}
body.theme-mac-only .dock {
  right: 0;
}
body.theme-mac-only .dock-inner {
  left: 50%;
  width: auto;
  max-width: calc(100vw - 28px);
  transform: translateX(-50%);
}
body.theme-mac-only.dock-left .dock,
body.theme-mac-only.dock-right .dock {
  top: 50%;
  bottom: auto;
  height: auto;
  width: auto;
  max-width: none;
  transform: translateY(-50%);
}
body.theme-mac-only.dock-left .dock {
  left: 12px;
  right: auto;
}
body.theme-mac-only.dock-right .dock {
  left: auto;
  right: 12px;
}
body.theme-mac-only.dock-left .dock-inner,
body.theme-mac-only.dock-right .dock-inner {
  position: static;
  margin: 0;
  left: auto;
  bottom: auto;
  width: auto;
  max-width: none;
  max-height: calc(100vh - 78px);
  flex-direction: column;
  align-items: center;
  transform: none;
  overflow: visible;
}
body.theme-mac-only.dock-left .dock-sep,
body.theme-mac-only.dock-right .dock-sep {
  width: 32px;
  height: 1px;
  margin: 4px 0;
}
body.theme-mac-only.dock-left .dock-tooltip,
body.theme-mac-only.dock-right .dock-tooltip {
  top: 50%;
  bottom: auto;
}
body.theme-mac-only.dock-left .dock-tooltip {
  left: calc(100% + 12px);
  transform: translateY(-50%) translateX(-6px);
}
body.theme-mac-only.dock-right .dock-tooltip {
  left: auto;
  right: calc(100% + 12px);
  transform: translateY(-50%) translateX(6px);
}
body.theme-mac-only.dock-left .dock-item:hover .dock-tooltip,
body.theme-mac-only.dock-left .dock-item.tooltip-demo .dock-tooltip,
body.theme-mac-only.dock-right .dock-item:hover .dock-tooltip,
body.theme-mac-only.dock-right .dock-item.tooltip-demo .dock-tooltip {
  transform: translateY(-50%) translateX(0);
}

body.theme-windows-only .menubar {
  left: 50%;
  right: auto;
  top: 10px;
  width: max-content;
  height: 38px;
  padding: 0 8px;
  transform: translateX(-50%);
  border-radius: 14px;
  color: rgba(247,251,255,0.92);
  background: rgba(15, 41, 80, 0.34);
  border: 1px solid rgba(255,255,255,0.16);
  box-shadow: 0 18px 50px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.12);
}
body.theme-windows-only {
  --green: #0078d4;
  --green-bright: #3aa7ff;
  --green-neon: #60cdff;
  --green-dim: #005a9e;
  --glow: 0 12px 32px rgba(0, 120, 212, 0.22);
}
body.theme-windows-only .menubar-left {
  display: none;
}
body.theme-windows-only .menubar-app,
body.theme-windows-only .menubar-clock {
  color: rgba(247,251,255,0.92);
}
body.theme-windows-only .menubar-right {
  color: rgba(247,251,255,0.86);
}
body.theme-windows-only .desktop-bg::before,
body.theme-windows-only .dock,
body.theme-windows-only .desktop-split-logo {
  display: none;
}
body.theme-windows-only .desktop-bg::after {
  left: -12%;
  border-left: none;
}
body.theme-windows-only .windows-taskbar {
  display: flex;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 56px;
  border-radius: 0;
  background: rgba(22, 52, 96, 0.58);
  border-top-color: rgba(255,255,255,0.22);
}
body.theme-windows-only .win {
  background: rgba(247, 250, 255, 0.76);
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 8px;
  color: #172033;
  box-shadow: 0 24px 70px -22px rgba(7, 24, 57, 0.56), 0 0 0 1px rgba(255,255,255,0.34);
}
body.theme-windows-only .win.is-focused {
  box-shadow: 0 28px 76px -24px rgba(7, 24, 57, 0.68), 0 0 0 1px rgba(0, 120, 212, 0.34);
}
body.theme-windows-only .win-titlebar {
  height: 38px;
  padding: 0 0 0 12px;
  background: rgba(248, 251, 255, 0.72);
  border-bottom: 1px solid rgba(36, 50, 74, 0.10);
  cursor: grab;
}
body.theme-windows-only .win-title {
  color: #172033;
  font-family: "Segoe UI", var(--font-body);
  font-size: 0.82rem;
  letter-spacing: 0;
}
body.theme-windows-only .win-titlebar .win-ico {
  color: #2563eb;
}
body.theme-windows-only .win-lights {
  order: 3;
  margin-left: auto;
  gap: 0;
  height: 100%;
}
body.theme-windows-only .win-light {
  width: 46px;
  height: 100%;
  border-radius: 0;
  background: transparent;
  color: #263244;
}
body.theme-windows-only .win-light::after {
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  font-family: "Segoe UI", var(--font-body);
  font-size: 0.94rem;
  line-height: 1;
}
body.theme-windows-only .win-close::after { content: "×"; }
body.theme-windows-only .win-min::after { content: "–"; transform: translateY(-2px); }
body.theme-windows-only .win-max::after { content: "□"; font-size: 0.72rem; }
body.theme-windows-only .win-light:hover {
  background: rgba(0, 120, 212, 0.10);
  box-shadow: none;
}
body.theme-windows-only .win-close:hover {
  color: #fff;
  background: #c42b1c;
}
body.theme-windows-only .win-body {
  color: #172033;
}
body.theme-windows-only .term {
  background: #012456;
  color: #f3f8ff;
}
body.theme-windows-only .term-output,
body.theme-windows-only .term-input {
  color: #f3f8ff;
}
body.theme-windows-only .term-prompt,
body.theme-windows-only .term-output .green {
  color: #ffd95a;
}
body.theme-mac-only .term {
  background: #101014;
  color: #f5f5f7;
}
body.theme-mac-only .term-output,
body.theme-mac-only .term-input {
  color: #f5f5f7;
}
body.theme-mac-only .term-prompt,
body.theme-mac-only .term-output .green {
  color: #34c759;
}
body.theme-windows-only .os-switcher {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.14);
}
body.theme-windows-only .os-switcher button {
  color: rgba(247,251,255,0.78);
}
body.theme-windows-only .os-switcher button:hover {
  color: #fff;
}
body.theme-mac-only .os-switcher {
  background: rgba(36, 50, 74, 0.05);
  border-color: rgba(36, 50, 74, 0.12);
}
.win-taskbar-left,
.win-taskbar-tray {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.win-taskbar-tray {
  gap: 10px;
  font-size: 0.72rem;
  line-height: 1.15;
  text-align: right;
}
.win-taskbar-button,
.win-taskbar-app,
.win-search,
.win-stock-widget {
  height: 38px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #eff7ff;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.14);
  transition: background 0.16s, transform 0.16s, box-shadow 0.16s;
}
.win-taskbar-button:hover,
.win-taskbar-app:hover,
.win-search:hover,
.win-stock-widget:hover {
  background: rgba(255,255,255,0.18);
  box-shadow: 0 10px 22px rgba(0,0,0,0.18);
  transform: translateY(-1px);
}
.win-taskbar-button::after,
.win-taskbar-app::after,
.win-search::after,
.win-stock-widget::after {
  content: attr(aria-label);
  position: absolute;
  left: 50%;
  bottom: calc(100% + 10px);
  transform: translateX(-50%) translateY(6px);
  padding: 6px 10px;
  border-radius: 7px;
  background: rgba(18, 28, 44, 0.92);
  color: #f7fbff;
  border: 1px solid rgba(255,255,255,0.14);
  box-shadow: 0 14px 32px rgba(0,0,0,0.24);
  font-family: "Segoe UI", var(--font-body);
  font-size: 0.74rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.16s, transform 0.16s;
}
.win-taskbar-button:hover::after,
.win-taskbar-app:hover::after,
.win-search:hover::after,
.win-stock-widget:hover::after,
.win-taskbar-button.tooltip-demo::after,
.win-taskbar-app.tooltip-demo::after,
.win-search.tooltip-demo::after,
.win-stock-widget.tooltip-demo::after {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.dock-item.tooltip-demo {
  transform: translateY(-12px) scale(1.18);
  box-shadow: var(--glow);
}
.dock-item.tooltip-demo .dock-tooltip {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.win-taskbar-button,
.win-taskbar-app,
.win-stock-widget {
  width: 42px;
  flex: 0 0 auto;
  position: relative;
}
.win-search { position: relative; }
.win-start img {
  width: 22px;
  height: 22px;
  object-fit: contain;
  border-radius: 4px;
}
.win-taskbar-app svg,
.win-search svg {
  width: 19px;
  height: 19px;
}
.win-stock-widget {
  width: 104px;
  justify-content: flex-start;
  gap: 8px;
  padding: 0 9px;
  font-family: "Segoe UI", var(--font-body);
}
.win-stock-widget .stock-widget-icon {
  width: 36px;
  height: 26px;
}
.win-stock-widget .stock-widget-meta b {
  color: #f7fbff;
  font-size: 0.7rem;
}
.win-stock-widget .stock-widget-meta span {
  color: #90f36b;
  font-size: 0.66rem;
}
.win-taskbar-app.is-open {
  background: rgba(255,255,255,0.22);
  box-shadow: inset 0 -2px 0 rgba(126, 206, 255, 0.92);
}
.win-search {
  width: min(210px, 20vw);
  justify-content: flex-start;
  gap: 9px;
  padding: 0 13px;
  color: rgba(247,251,255,0.86);
}
.win-search span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.win-tray-chip {
  color: rgba(247,251,255,0.86);
}
.win-tray-time,
.win-tray-date {
  display: block;
  font-variant-numeric: tabular-nums;
  color: rgba(247,251,255,0.94);
}

.windows-search-panel {
  position: fixed;
  left: 50%;
  bottom: 68px;
  z-index: 625;
  width: min(640px, calc(100vw - 28px));
  padding: 14px;
  border-radius: 14px;
  background: rgba(244, 249, 255, 0.82);
  border: 1px solid rgba(255,255,255,0.62);
  box-shadow: 0 28px 80px rgba(7, 24, 57, 0.34), inset 0 1px 0 rgba(255,255,255,0.62);
  -webkit-backdrop-filter: blur(28px) saturate(170%);
  backdrop-filter: blur(28px) saturate(170%);
  transform: translateX(-50%) translateY(12px) scale(0.98);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.16s, transform 0.16s, visibility 0.16s;
}
body.theme-windows-only .windows-search-panel.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0) scale(1);
}
.windows-search-box {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 44px;
  padding: 0 13px;
  border-radius: 10px;
  background: rgba(255,255,255,0.82);
  border: 1px solid rgba(0, 120, 212, 0.20);
  box-shadow: inset 0 -2px 0 rgba(0, 120, 212, 0.62);
}
.windows-search-box svg {
  width: 18px;
  height: 18px;
  color: #0078d4;
}
.windows-search-box input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  color: #172033;
  font: 600 0.92rem "Segoe UI", var(--font-body);
  outline: none;
}
.windows-search-results {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(168px, 1fr));
  gap: 8px;
  margin-top: 12px;
}
.windows-search-result {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 9px 10px;
  border-radius: 9px;
  color: #172033;
  background: rgba(255,255,255,0.48);
  border: 1px solid rgba(36, 50, 74, 0.08);
  font-family: "Segoe UI", var(--font-body);
  text-align: left;
}
.windows-search-result:hover,
.windows-search-result.is-selected {
  background: rgba(0, 120, 212, 0.10);
  border-color: rgba(0, 120, 212, 0.24);
}
.windows-search-result svg {
  width: 18px;
  height: 18px;
  color: #0078d4;
  flex: 0 0 auto;
}
.windows-search-result > div {
  min-width: 0;
}
.windows-search-result b {
  display: block;
  font-size: 0.84rem;
  line-height: 1.1;
}
.windows-search-result span {
  display: block;
  margin-top: 2px;
  color: #647084;
  font-size: 0.72rem;
}

.stock-popover {
  position: fixed;
  left: 50%;
  bottom: calc(var(--dock-h) + 18px);
  z-index: 640;
  width: min(340px, calc(100vw - 24px));
  padding: 14px;
  border-radius: 14px;
  color: var(--txt);
  background: rgba(9, 13, 11, 0.88);
  border: 1px solid rgba(118,185,0,0.22);
  box-shadow: 0 24px 70px rgba(0,0,0,0.42), inset 0 1px 0 rgba(255,255,255,0.08);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  backdrop-filter: blur(22px) saturate(150%);
  transform: translateX(-50%) translateY(12px) scale(0.97);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.16s, transform 0.16s, visibility 0.16s;
}
.stock-popover.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0) scale(1);
}
.stock-popover-head,
.stock-popover-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.stock-kicker {
  display: block;
  margin-bottom: 2px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.stock-popover-head strong {
  font: 800 1rem var(--font-ui);
  letter-spacing: 0.05em;
}
.stock-live-dot {
  position: relative;
  padding: 5px 9px 5px 18px;
  border-radius: 999px;
  background: rgba(118,185,0,0.14);
  border: 1px solid rgba(118,185,0,0.24);
  color: #dfffd2;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.stock-live-dot::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 50%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #76B900;
  box-shadow: 0 0 10px rgba(118,185,0,0.72);
  transform: translateY(-50%);
}
.stock-popover-price {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-top: 9px;
}
.stock-popover-price span {
  font: 800 2rem var(--font-ui);
  color: #f7fff2;
  font-variant-numeric: tabular-nums;
}
.stock-popover-price b {
  color: #8cff65;
  font-size: 0.9rem;
  font-variant-numeric: tabular-nums;
}
.stock-popover-price b.is-down {
  color: #ff7f7a;
}
.stock-detail-chart {
  width: 100%;
  height: 128px;
  margin-top: 10px;
  overflow: visible;
}
.stock-detail-grid {
  fill: none;
  stroke: rgba(255,255,255,0.11);
  stroke-width: 1;
}
[data-stock-detail-line] {
  fill: none;
  stroke: var(--green-bright);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 9px rgba(118,185,0,0.48));
}
.stock-detail-candle {
  fill: rgba(118,185,0,0.24);
  stroke: #f3ffe8;
  stroke-width: 2.5;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 10px rgba(118,185,0,0.54));
}
.stock-popover.stock-is-down [data-stock-detail-line] {
  stroke: #ff7f7a;
}
.stock-popover.stock-is-down .stock-detail-candle {
  fill: rgba(255,95,87,0.24);
  stroke: #ffd1cf;
}
.stock-popover-foot {
  margin-top: 6px;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 600;
}
body.theme-mac-only .stock-dock-widget {
  background: rgba(255,255,255,0.58);
  border-color: rgba(36, 50, 74, 0.10);
}
body.theme-mac-only .stock-widget-meta b {
  color: #1d1d1f;
}
body.theme-mac-only .stock-widget-meta span {
  color: #188a2c;
}
body.theme-mac-only .stock-is-down .stock-widget-meta span {
  color: #d72f2f;
}
body.theme-mac-only .stock-grid-line {
  stroke: rgba(29,29,31,0.16);
}
body.theme-mac-only .stock-popover {
  color: #1d1d1f;
  background: rgba(248, 250, 255, 0.86);
  border-color: rgba(36, 50, 74, 0.12);
  box-shadow: 0 24px 70px rgba(40,52,74,0.25), inset 0 1px 0 rgba(255,255,255,0.72);
}
body.theme-mac-only .stock-popover-price span,
body.theme-mac-only .stock-popover-head strong {
  color: #1d1d1f;
}
body.theme-mac-only .stock-live-dot {
  color: #0b5f17;
  background: rgba(52,199,89,0.13);
  border-color: rgba(52,199,89,0.22);
}
body.theme-mac-only .stock-detail-grid {
  stroke: rgba(29,29,31,0.12);
}
body.theme-windows-only .stock-popover {
  bottom: 68px;
  color: #172033;
  background: rgba(244, 249, 255, 0.88);
  border-color: rgba(255,255,255,0.58);
  box-shadow: 0 28px 80px rgba(7,24,57,0.34), inset 0 1px 0 rgba(255,255,255,0.62);
}
body.theme-windows-only .stock-popover-price span,
body.theme-windows-only .stock-popover-head strong {
  color: #172033;
}
body.theme-windows-only .stock-live-dot {
  color: #075d1c;
  background: rgba(16,124,16,0.12);
  border-color: rgba(16,124,16,0.22);
}
body.theme-windows-only .stock-detail-grid {
  stroke: rgba(7,24,57,0.11);
}

body.theme-windows-only.taskbar-top .windows-taskbar {
  top: 54px;
  bottom: auto;
  border-top: none;
  border-bottom: 1px solid rgba(255,255,255,0.20);
  box-shadow: 0 18px 48px rgba(0,0,0,0.20), inset 0 -1px 0 rgba(255,255,255,0.08);
}
body.theme-windows-only.taskbar-left .windows-taskbar,
body.theme-windows-only.taskbar-right .windows-taskbar {
  top: 54px;
  bottom: 0;
  width: 66px;
  height: auto;
  padding: 12px 8px;
  flex-direction: column;
  border-top: none;
  box-shadow: 18px 0 48px rgba(0,0,0,0.18), inset 1px 0 0 rgba(255,255,255,0.08);
}
body.theme-windows-only.taskbar-left .windows-taskbar {
  left: 0;
  right: auto;
  border-right: 1px solid rgba(255,255,255,0.18);
}
body.theme-windows-only.taskbar-right .windows-taskbar {
  left: auto;
  right: 0;
  border-left: 1px solid rgba(255,255,255,0.18);
}
body.theme-windows-only.taskbar-left .win-taskbar-left,
body.theme-windows-only.taskbar-right .win-taskbar-left,
body.theme-windows-only.taskbar-left .win-taskbar-tray,
body.theme-windows-only.taskbar-right .win-taskbar-tray {
  position: static;
  transform: none;
  flex-direction: column;
}
body.theme-windows-only.taskbar-left .win-taskbar-left,
body.theme-windows-only.taskbar-right .win-taskbar-left {
  margin: auto 0;
}
body.theme-windows-only.taskbar-left .win-taskbar-tray,
body.theme-windows-only.taskbar-right .win-taskbar-tray {
  margin-top: auto;
  right: auto;
}
body.theme-windows-only.taskbar-left .win-search,
body.theme-windows-only.taskbar-right .win-search,
body.theme-windows-only.taskbar-left .win-stock-widget,
body.theme-windows-only.taskbar-right .win-stock-widget {
  width: 42px;
  padding: 0;
  justify-content: center;
}
body.theme-windows-only.taskbar-left .win-search span,
body.theme-windows-only.taskbar-right .win-search span,
body.theme-windows-only.taskbar-left .win-tray-date,
body.theme-windows-only.taskbar-right .win-tray-date,
body.theme-windows-only.taskbar-left .win-tray-chip,
body.theme-windows-only.taskbar-right .win-tray-chip,
body.theme-windows-only.taskbar-left .win-stock-widget .stock-widget-meta,
body.theme-windows-only.taskbar-right .win-stock-widget .stock-widget-meta {
  display: none;
}

@keyframes macos-wallpaper {
  to { transform: translate(1.5%, -1.25%) scale(1.04); }
}
@keyframes windows-wallpaper {
  to { transform: translate(-1%, -1.2%) scale(1.03); }
}

@media (max-width: 620px) {
  body.theme-macos .menubar-left::after {
    content: "File Edit";
    word-spacing: 0.5em;
  }
  body.theme-macos .menubar-stat { display: none; }
}

@media (max-width: 768px) {
  body.theme-macos .menubar {
    right: 0;
    border-right: none;
  }
  body.theme-macos .dock {
    right: 0;
  }
  body.theme-macos .windows-taskbar {
    display: none;
  }
  body.theme-windows-only .windows-taskbar {
    display: flex;
  }
  body.theme-macos .desktop-watermark::before {
    display: none;
  }
  body.theme-macos .desktop-split-logo {
    width: 104px;
    height: 76px;
    border-radius: 20px;
  }
  body.theme-macos .desktop-split-logo .split-logo-apple img {
    width: 40px;
  }
  body.theme-macos .desktop-split-logo .split-logo-msft img {
    width: 46px;
  }
}

/* =================================================================
   RESPONSIVE — mobile = stacked, maximized windows, no drag
   ================================================================= */
@media (max-width: 768px) {
  :root { --dock-h: 66px; --shell-bottom: var(--dock-h); --shell-top: 0px; }
  body.theme-windows-only {
    --taskbar-h: 52px;
    --shell-bottom: var(--taskbar-h);
    --shell-top: 0px;
  }
  .desktop-widgets {
    display: none;
  }
  .windows-mobile-hint {
    display: none;
  }
  body.theme-windows-only .windows-mobile-hint {
    position: absolute;
    left: 50%;
    bottom: calc(var(--taskbar-h) + 28px);
    z-index: 6;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    width: min(320px, calc(100% - 32px));
    padding: 16px 18px;
    border-radius: 14px;
    text-align: center;
    color: #eff7ff;
    background: rgba(15, 41, 80, 0.42);
    border: 1px solid rgba(255,255,255,0.18);
    box-shadow: 0 18px 48px rgba(0,0,0,0.22);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    backdrop-filter: blur(18px) saturate(140%);
    transform: translateX(-50%);
    pointer-events: none;
  }
  body.theme-windows-only .windows-mobile-hint img {
    width: 34px;
    height: 34px;
    border-radius: 8px;
  }
  body.theme-windows-only .windows-mobile-hint p {
    margin: 0;
    font-family: "Segoe UI", var(--font-body);
    font-size: 0.84rem;
    line-height: 1.45;
    color: rgba(239,247,255,0.92);
  }
  body.theme-windows-only .windows-mobile-hint strong {
    color: #60cdff;
  }
  body.theme-windows-only .desktop:has(.win.is-open) .windows-mobile-hint {
    display: none;
  }
  body.theme-windows-only .mobile-launcher {
    display: none !important;
  }
  body.theme-macos .desktop:has(.win.is-open) .mobile-launcher,
  body.theme-dgx .desktop:has(.win.is-open) .mobile-launcher {
    display: none;
  }
  body.theme-windows-only .desktop {
    margin-top: 0;
  }
  body.theme-windows-only .menubar {
    top: max(8px, env(safe-area-inset-top));
    left: 8px;
    right: 8px;
    width: auto;
    max-width: none;
    transform: none;
    height: auto;
    min-height: 38px;
    padding: 6px 8px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  body.theme-windows-only .menubar-right {
    flex-wrap: nowrap;
    gap: 6px;
  }
  body.theme-windows-only .os-switcher button {
    padding: 0 8px;
    font-size: 0.68rem;
  }
  body.theme-windows-only .windows-taskbar {
    display: flex;
    height: var(--taskbar-h);
    padding: 0 6px;
    gap: 4px;
    align-items: center;
    padding-bottom: max(0px, env(safe-area-inset-bottom));
  }
  body.theme-windows-only .win-taskbar-left {
    flex: 1;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    padding-right: 4px;
  }
  body.theme-windows-only .win-taskbar-left::-webkit-scrollbar,
  body.theme-windows-only .menubar::-webkit-scrollbar {
    display: none;
  }
  body.theme-windows-only .win-taskbar-button,
  body.theme-windows-only .win-taskbar-app,
  body.theme-windows-only .win-search {
    width: 40px;
    min-width: 40px;
    height: 40px;
    flex: 0 0 auto;
    border-radius: 8px;
  }
  body.theme-windows-only .win-search span,
  body.theme-windows-only .win-stock-widget,
  body.theme-windows-only .win-tray-chip,
  body.theme-windows-only .win-tray-date {
    display: none;
  }
  body.theme-windows-only .win-taskbar-tray {
    flex: 0 0 auto;
    padding-left: 4px;
  }
  body.theme-windows-only .win-tray-time {
    font-size: 0.72rem;
    white-space: nowrap;
  }
  body.theme-windows-only .win-taskbar-button::after,
  body.theme-windows-only .win-taskbar-app::after,
  body.theme-windows-only .win-search::after {
    display: none;
  }
  .mobile-launcher {
    position: absolute;
    inset: calc(var(--menubar-h) + 12px) 14px calc(var(--shell-bottom) + 18px);
    z-index: 7;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-content: start;
    gap: 10px;
    overflow: auto;
  }
  .mobile-launcher button {
    min-height: 92px;
    border-radius: 14px;
    background: rgba(255,255,255,0.12);
    border: 1px solid var(--line-soft);
    color: var(--txt);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    -webkit-backdrop-filter: blur(16px) saturate(145%);
    backdrop-filter: blur(16px) saturate(145%);
  }
  body.theme-mac-only .mobile-launcher button {
    background: rgba(255,255,255,0.58);
    border-color: rgba(36, 50, 74, 0.12);
    color: #1d1d1f;
  }
  body.theme-mac-only .mobile-launcher svg {
    color: #2563eb;
  }
  .mobile-launcher svg {
    width: 28px;
    height: 28px;
    color: var(--green-bright);
  }
  .mobile-launcher span {
    font-weight: 800;
    font-size: 0.82rem;
  }
  .win {
    width: 100% !important;
    top: var(--shell-top) !important;
    left: 0 !important;
    max-width: 100%;
    height: calc(100% - var(--shell-top) - var(--shell-bottom)) !important;
    border-radius: 0;
    border-left: none;
    border-right: none;
  }
  body.theme-windows-only .win {
    border-radius: 10px 10px 0 0;
    box-shadow: 0 -8px 40px rgba(7, 24, 57, 0.28);
  }
  .win-titlebar { cursor: default; }
  .win-resize-handle { display: none; }
  .win-body { padding: 18px 16px calc(var(--shell-bottom) + 20px); }
  .desktop-watermark > img { width: 84px; }
  .blackhole,
  .whitehole,
  .greyhole { width: 92px; }
  .about-avatar { width: 72px; height: 72px; }
  .about-id .name { font-size: 1.5rem; }
  .dock { bottom: 8px; left: 8px; right: 8px; transform: none; max-width: none; }
  .dock-inner { justify-content: flex-start; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
  .dock-item { width: 44px; height: 44px; }
  .dock-item:hover { transform: none; box-shadow: none; }
  .dock-tooltip { display: none; }
  .mission-control,
  .universal-search,
  .app-launcher,
  .command-palette {
    padding: 10px;
  }
  .overlay-shell,
  .search-shell {
    width: 100%;
    max-height: calc(100vh - 22px);
    border-radius: 14px;
  }
  .mission-grid,
  .launcher-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .notification-stack {
    right: 10px;
    left: 10px;
    width: auto;
    bottom: calc(var(--shell-bottom) + 12px);
  }
}

@media (min-width: 769px) {
  .mobile-launcher { display: none; }
}

body.theme-mac-only .overlay-shell,
body.theme-mac-only .search-shell,
body.theme-mac-only .desktop-widget,
body.theme-mac-only .notification {
  color: #1d1d1f;
  background: rgba(248, 250, 255, 0.76);
  border-color: rgba(36, 50, 74, 0.12);
  box-shadow: 0 28px 74px rgba(40,52,74,0.26), inset 0 1px 0 rgba(255,255,255,0.72);
}
body.theme-mac-only .overlay-head strong,
body.theme-mac-only .desktop-widget strong,
body.theme-mac-only .notification b,
body.theme-mac-only .search-input-row input,
body.theme-mac-only .search-result-row,
body.theme-mac-only .launcher-tile,
body.theme-mac-only .mission-card {
  color: #1d1d1f;
}
body.theme-mac-only .mission-card,
body.theme-mac-only .launcher-tile,
body.theme-mac-only .search-result-row {
  background: rgba(255,255,255,0.42);
  border-color: rgba(36, 50, 74, 0.1);
}
body.theme-windows-only .overlay-shell,
body.theme-windows-only .search-shell,
body.theme-windows-only .desktop-widget,
body.theme-windows-only .notification {
  color: #172033;
  background: rgba(244, 249, 255, 0.82);
  border-color: rgba(255,255,255,0.56);
}
body.theme-windows-only .overlay-head strong,
body.theme-windows-only .desktop-widget strong,
body.theme-windows-only .notification b,
body.theme-windows-only .search-input-row input,
body.theme-windows-only .search-result-row,
body.theme-windows-only .launcher-tile,
body.theme-windows-only .mission-card {
  color: #172033;
}
body.theme-windows-only .mission-card,
body.theme-windows-only .launcher-tile,
body.theme-windows-only .search-result-row {
  background: rgba(255,255,255,0.46);
  border-color: rgba(36, 50, 74, 0.1);
}

/* =================================================================
   PORTFOLIO FX
   ================================================================= */
.aurora-trail { position: fixed; inset: 0; z-index: 420; pointer-events: none; }
.menubar-dgx-status { display: none; font-family: var(--font-mono); font-size: 0.7rem; color: var(--green-bright); max-width: min(240px, 28vw); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.menubar-dgx-status.is-active { display: inline-block; }
body.theme-dgx .menubar-dgx-status.is-active { text-shadow: 0 0 12px rgba(118,185,0,0.45); }
.menubar-sound { width: 26px; height: 24px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; font-size: 0.82rem; color: var(--txt-dim); background: rgba(255,255,255,0.06); border: 1px solid var(--line-soft); }
.menubar-sound.is-muted { opacity: 0.42; }
body.theme-dgx .desktop-bg::before {
  background:
    radial-gradient(ellipse 60% 50% at 20% 10%, rgba(118,185,0,0.14), transparent 62%),
    radial-gradient(ellipse 50% 60% at 85% 90%, rgba(118,185,0,0.08), transparent 62%);
}
body.theme-dgx .desktop-video,
body.wallpaper-day.theme-dgx .desktop-video {
  opacity: 0.94;
}
body.wallpaper-night.theme-dgx .desktop-video {
  opacity: 0.78;
}
body.wallpaper-night.theme-dgx .desktop-bg::before {
  filter: brightness(0.9) saturate(0.92);
}
body.wallpaper-night.theme-macos .desktop-bg::before,
body.wallpaper-night.theme-mac-only .desktop-bg::before {
  filter: saturate(1.08) contrast(1.02);
}
body.wallpaper-night.theme-macos .desktop-bg::after {
  filter: saturate(1.06) contrast(1.02);
}
body.wallpaper-night .desktop-bg::before { filter: brightness(0.48) saturate(0.75); transition: filter 2.4s ease; }
body.wallpaper-night .desktop-video { opacity: 0.28; transition: opacity 2.4s ease; }
body.wallpaper-day .desktop-video { opacity: 0.52; transition: opacity 2.4s ease; }
body.shader-party .desktop-bg::before { animation: bgdrift 6s ease-in-out infinite alternate, shader-hue 10s linear infinite; }
@keyframes shader-hue { to { filter: hue-rotate(360deg) saturate(1.4); } }
.confetti-layer { position: fixed; inset: 0; z-index: 9800; pointer-events: none; overflow: hidden; }
.confetti-layer i { position: absolute; left: var(--x); top: -12px; width: 8px; height: 14px; background: hsl(var(--hue), 90%, 58%); animation: confetti-fall 3.8s forwards; animation-delay: var(--delay); }
@keyframes confetti-fall { to { transform: translateY(110vh); opacity: 0; } }
body.crt-mode #os::after { content: ""; position: fixed; inset: 0; z-index: 9400; pointer-events: none; background: repeating-linear-gradient(0deg, rgba(0,0,0,0) 0 2px, rgba(0,0,0,0.14) 2px 4px); opacity: 0.55; }
[data-crt-toggle].is-active { background: var(--green) !important; color: #08120a !important; }
.bigbang-iris-canvas { position: absolute; left: var(--impact-x, 50%); top: var(--impact-y, 50%); width: min(76vmin, 720px); height: min(76vmin, 720px); transform: translate(-50%, -50%); pointer-events: none; z-index: 3; mix-blend-mode: screen; opacity: 0.92; }
.bigbang-iris--webgl .bigbang-iris-blade,
.bigbang-iris--webgl .bigbang-iris-spoke,
.bigbang-iris--webgl .bigbang-iris-pupil,
.bigbang-iris--webgl .bigbang-iris-ring { display: none; }

.pwa-install-banner {
  position: fixed;
  left: 50%;
  bottom: calc(var(--shell-bottom, 66px) + 14px);
  z-index: 9700;
  width: min(360px, calc(100% - 24px));
  padding: 14px 16px;
  border-radius: 14px;
  color: #eff7ff;
  background: rgba(12, 28, 52, 0.92);
  border: 1px solid rgba(118, 185, 0, 0.35);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.38);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
  transform: translateX(-50%) translateY(120%);
  opacity: 0;
  transition: transform 0.45s cubic-bezier(0.18, 0.88, 0.2, 1), opacity 0.35s ease;
  pointer-events: auto;
}
.pwa-install-banner.is-visible {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}
.pwa-install-banner p {
  margin: 0 0 12px;
  font-size: 0.86rem;
  line-height: 1.45;
  color: rgba(239, 247, 255, 0.94);
}
.pwa-install-banner strong { color: #76B900; }
.pwa-install-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
.pwa-install-go {
  flex: 1;
  padding: 9px 12px;
  border-radius: 9px;
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 0.84rem;
  color: #08120a;
  background: var(--green);
  box-shadow: var(--glow);
}
.pwa-install-dismiss {
  padding: 9px 10px;
  border-radius: 9px;
  font-size: 0.8rem;
  color: rgba(239, 247, 255, 0.72);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
}
@media (display-mode: standalone) {
  .pwa-install-banner { display: none !important; }
}

/* =================================================================
   REDUCED MOTION
   ================================================================= */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.05ms !important; }
  .desktop-bg::before { animation: none; }
  .boot-logo { animation: none; }
  .iris-boot-scanner.is-scanning .iris-boot-scanline { animation: none; opacity: 0; }
  .iris-boot-blade { transform: rotate(var(--blade-angle)) rotate(0deg) !important; }
  body.os-glitching #os { animation: none !important; }
}