/*
 * UBER HACKER
 * Golden reference: ../reference/uber-hacker.png
 *
 * Classic Macintosh typography pushed through a damaged neon terminal.
 * Deep black, phosphor green, hot magenta and deliberately exposed edges.
 */

:root[data-theme="uber-hacker"],
[data-theme="uber-hacker"] {
  color-scheme: dark;

  /* Classic Macintosh hierarchy: Chicago / Geneva / Monaco / New York. */
  --font-ui: "Geneva", "Lucida Grande", "IBM Plex Sans", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-copy: "New York", "Iowan Old Style", Palatino, "IBM Plex Serif", Georgia, serif;
  --font-mono: "Monaco", "SFMono-Regular", "IBM Plex Mono", Menlo, Consolas, monospace;
  --font-terminal: "Terminus TTF", "Terminus", var(--font-mono);
  --font-display: "Chicago", "Charcoal", "Geneva", "IBM Plex Sans Condensed", sans-serif;

  --weight-normal: 400;
  --weight-medium: 500;
  --weight-strong: 700;

  --text-xxs: 10px;
  --text-xs: 11px;
  --text-sm: 13px;
  --text-md: 15px;
  --text-lg: 19px;
  --text-xl: 23px;

  --line-tight: 1.06;
  --line-ui: 1.18;
  --line-copy: 1.38;

  --tracking-ui: -.012em;
  --tracking-label: .045em;
  --tracking-display: -.025em;

  --space-1: 2px;
  --space-2: 4px;
  --space-3: 6px;
  --space-4: 8px;
  --space-5: 10px;
  --space-6: 12px;
  --space-7: 16px;
  --space-8: 20px;

  --radius-window: 0;
  --radius-control: 0;
  --border-width: 1px;

  --titlebar-height: 26px;
  --titlebar-button-size: 14px;
  --menubar-height: 35px;
  --front-panel-height: 68px;
  --statusbar-height: 22px;
  --dockapp-size: 101px;
  --window-gap: 11px;
  --dockapp-gap: var(--window-gap);
  --scrollbar-size: 12px;
  --meter-height: 4px;

  --uh-black: #000203;
  --uh-black-2: #010506;
  --uh-black-3: #03080a;
  --uh-black-4: #071014;

  --uh-paper: #c9c5bf;
  --uh-muted: #999692;
  --uh-dim: #62686a;

  --uh-green: #45ef76;
  --uh-green-hi: #70ff92;
  --uh-green-deep: #18bd51;

  --uh-magenta: #ed55d3;
  --uh-magenta-hi: #ff7be9;
  --uh-magenta-deep: #a72b95;

  --uh-cyan: #35bfd2;
  --uh-amber: #c9953a;
  --uh-red: #f06477;

  --desktop-bg: var(--uh-black);
  --desktop-bg-alt: #010608;

  --surface-window: #020306;
  --surface-window-alt: #040509;
  --surface-raised: #060c0f;
  --surface-sunken: #000203;
  --surface-input: #010405;
  --surface-menubar: #030204;
  --surface-titlebar: #050307;
  --surface-titlebar-inactive: #020607;
  --surface-statusbar: #020709;
  --surface-dockapp: #010507;
  --surface-terminal: #000203;
  --surface-selection: #351139;

  --text-primary: #c6c2bc;
  --text-secondary: #a5a19d;
  --text-muted: #666b6d;
  --text-disabled: #383d3f;

  --text-titlebar: #c2beb8;
  --text-titlebar-inactive: #646a6c;
  --text-menubar: #bdb9b3;
  --text-statusbar: #8f9491;

  --text-terminal: #c3c1bc;
  --text-terminal-dim: #747b76;

  --accent-primary: var(--uh-green);
  --accent-secondary: var(--uh-magenta);
  --accent-tertiary: var(--uh-cyan);
  --accent-warning: var(--uh-amber);
  --accent-danger: var(--uh-red);
  --accent-ok: var(--uh-green-hi);

  --link: var(--uh-magenta-hi);
  --link-hover: #ffacef;

  --selection-bg: #3b123f;
  --selection-fg: #ffe3f8;
  --focus-color: var(--uh-magenta);

  --border-outer: #3d484c;
  --border-inner: #0f1b1f;
  --border-muted: #1b272b;

  --bevel-highlight: #334147;
  --bevel-light: #17252a;
  --bevel-dark: #020607;
  --bevel-shadow: #000102;

  --separator: #30202c;
  --window-outline: #58434f;
  --titlebar-rule: 1px dotted #543449;

  --shadow-window:
    4px 4px 0 rgb(0 0 0 / 88%),
    0 0 12px rgb(237 85 211 / 9%);

  --shadow-raised:
    inset 1px 1px 0 #303e43,
    inset -1px -1px 0 #000102,
    inset 0 0 0 1px #0d171a;

  --shadow-sunken:
    inset 1px 1px 0 #000102,
    inset -1px -1px 0 #26353a,
    inset 0 0 0 1px #061014;

  --shadow-focus:
    0 0 0 1px var(--focus-color),
    0 0 9px rgb(237 85 211 / 31%);

  --glow-text:
    0 0 2px rgb(69 239 118 / 21%),
    0 0 5px rgb(69 239 118 / 7%);

  --glow-accent:
    0 0 4px rgb(237 85 211 / 28%),
    0 0 10px rgb(237 85 211 / 11%);

  --glow-terminal:
    0 0 2px rgb(69 239 118 / 29%),
    0 0 6px rgb(69 239 118 / 12%);

  --meter-track: #07100c;
  --meter-fill: var(--uh-green);
  --meter-fill-alt: var(--uh-magenta);
  --meter-fill-warn: var(--uh-amber);

  --graph-grid: #11281c;
  --graph-line: var(--uh-green-hi);
  --graph-line-alt: var(--uh-magenta-hi);
  --graph-baseline: #21402c;

  --led-off: #0d2c18;
  --led-on: var(--uh-green-hi);
  --led-warn: var(--uh-magenta-hi);

  --dock-label: var(--uh-green-hi);
  --dock-value: #c7c3bd;

  --terminal-prompt: var(--uh-green);
  --terminal-user: var(--uh-green-hi);
  --terminal-path: #78d68d;
  --terminal-command: var(--uh-green-hi);
  --terminal-cursor: var(--uh-green-hi);
  --terminal-error: #ff7083;
  --terminal-warning: #eab659;

  --workspace-active-bg: #2d0f32;
  --workspace-active-fg: var(--uh-magenta-hi);
  --workspace-inactive-bg: #010506;
  --workspace-inactive-fg: #b5b1ac;
  --workspace-border: #333e42;

  --scanline-color: #62ff89;
  --scanline-opacity: .065;
  --scanline-size: 4px;
  --noise-opacity: .045;
  --vignette-opacity: .22;
  --phosphor-blur: .32px;
  --image-filter: contrast(1.16) brightness(.71) saturate(1.26) hue-rotate(-5deg);
  --icon-opacity: .93;
  --avatar-bg: #d7a6cf;
  --avatar-filter: grayscale(1) contrast(1.65) brightness(.58);
  --avatar-opacity: 1;
}

/* Uber Hacker exposes its chrome: offset panels, neon seams, hard pixels. */
[data-theme="uber-hacker"] body {
  background-color: #000;
  background-image:
    linear-gradient(rgb(0 0 0 / 22%), rgb(0 0 0 / 38%)),
    radial-gradient(circle at 88% 8%, rgb(237 85 211 / 9%), transparent 24%),
    radial-gradient(circle at 12% 88%, rgb(69 239 118 / 5%), transparent 28%),
    url("../assets/images/uber-hacker-wallpaper.webp");
  background-position: center;
  background-size: auto, auto, auto, cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

[data-theme="uber-hacker"] .menubar {
  margin: var(--space-4) var(--space-6) 0;
  border: 1px solid #493642;
  border-left-color: var(--accent-primary);
  background: linear-gradient(90deg, rgb(69 239 118 / 4%), transparent 28%), var(--surface-menubar);
  box-shadow: 3px 3px 0 rgb(0 0 0 / 70%);
}

[data-theme="uber-hacker"] .menubar__brand { color: var(--accent-primary); }

[data-theme="uber-hacker"] .menubar__avatar {
  border-color: var(--accent-secondary);
  box-shadow: 0 0 6px rgb(237 85 211 / 20%);
}

[data-theme="uber-hacker"] .menubar__nav a + a::before {
  content: "|";
  margin-right: var(--space-4);
  color: #57434f;
}

[data-theme="uber-hacker"] .menubar__theme select,
[data-theme="uber-hacker"] .menubar__language button {
  min-height: 18px;
  border-color: #56384c;
  background: #050306;
  color: var(--accent-secondary);
  box-shadow: none;
}

[data-theme="uber-hacker"] .menubar__theme::after { color: var(--accent-secondary); }

[data-theme="uber-hacker"] .menubar__language button[aria-pressed="true"] {
  border-color: var(--accent-secondary);
  background: #110912;
}

[data-theme="uber-hacker"] .window {
  border-color: var(--window-outline);
  border-left: 2px solid var(--accent-secondary);
  background-image: linear-gradient(135deg, rgb(237 85 211 / 2%), transparent 38%);
  box-shadow: var(--shadow-window);
}

[data-theme="uber-hacker"] .desktop > .window:nth-of-type(3n + 2) {
  border-left-color: var(--accent-primary);
}

[data-theme="uber-hacker"] .window__titlebar {
  background:
    linear-gradient(90deg, rgb(237 85 211 / 8%), transparent 38%),
    var(--surface-titlebar);
}

[data-theme="uber-hacker"] .window__titlebar::before {
  content: "::::";
  color: var(--accent-secondary);
  font-size: var(--text-xs);
  letter-spacing: -2px;
}

[data-theme="uber-hacker"] .window__controls { gap: 4px; }

[data-theme="uber-hacker"] .window__controls i,
[data-theme="uber-hacker"] .window__hide {
  border-color: #6f355f;
  background: #060307;
  box-shadow: none;
}

[data-theme="uber-hacker"] .window__controls i:first-child {
  width: 5px;
  border: 0;
  background: var(--accent-primary);
  box-shadow: 0 0 5px rgb(69 239 118 / 30%);
}

[data-theme="uber-hacker"] .dockapp {
  border-color: #57404c;
  border-left: 2px solid var(--accent-secondary);
  background-image: linear-gradient(135deg, rgb(237 85 211 / 5%), transparent 55%);
  box-shadow: 3px 3px 0 rgb(0 0 0 / 65%);
}

[data-theme="uber-hacker"] .dockapp:nth-child(even) { border-left-color: var(--accent-primary); }

[data-theme="uber-hacker"] .front-panel {
  margin: 0 var(--space-6) var(--space-4);
  border: 1px solid #493642;
  border-top-color: var(--accent-secondary);
  background: linear-gradient(90deg, rgb(237 85 211 / 5%), transparent 32%), var(--surface-statusbar);
  box-shadow: 3px 3px 0 rgb(0 0 0 / 72%);
}

[data-theme="uber-hacker"] .ws,
[data-theme="uber-hacker"] .front-panel__restore {
  box-shadow: none;
}

[data-theme="uber-hacker"] .ws--active {
  border-color: var(--accent-secondary);
  box-shadow: inset 0 2px 0 var(--accent-secondary), 0 0 8px rgb(237 85 211 / 14%);
}

[data-theme="uber-hacker"] .front-panel__launchers a:nth-child(odd) span {
  color: var(--accent-secondary);
  text-shadow: var(--glow-accent);
}

[data-theme="uber-hacker"] .terminal__input-row {
  border-top-style: dotted;
  border-top-color: var(--accent-primary);
}

@media (max-width: 620px) {
  [data-theme="uber-hacker"] .menubar,
  [data-theme="uber-hacker"] .front-panel { margin-inline: var(--space-2); }
}

/* Uber Hacker-only: audio.device is an asymmetric interception instrument. */
[data-theme="uber-hacker"] .audio-device__panel,
[data-theme="uber-hacker"] .audio-device__xterm {
  display: none;
}
[data-theme="uber-hacker"] .audio-device__intercept {
  display: flex;
}
[data-theme="uber-hacker"] .w-audio .window__title {
  font-size: 0;
}
[data-theme="uber-hacker"] .w-audio .window__title::before {
  content: "AUDIO::INTERCEPT";
  font-size: var(--text-xs);
  letter-spacing: var(--tracking-label);
}