:root {
  color-scheme: dark;
  --bg: #020507;
  --elevated: #0f161f;
  --primary: #9ea9b0;
  --text: #74828d;
  --dim: #3f4d55;
  --border: #222b37;
  --scanline: rgba(158, 169, 176, 0.035);
  --glow: rgba(116, 130, 141, 0.18);
  --ink: #05090d;
  --shadow: rgba(0, 0, 0, 0.72);
  --desktop-scale: 1;
  --dock-width: 232px;
  --dock-center: 116px;
  --body-font-size: 16px;
  --window-width: 720px;
  --window-max-height: 560px;
  --terminal-width: 680px;
  --terminal-height: 390px;
  --navichan-width: 980px;
  --navichan-height: 700px;
  --image-window-width: 860px;
}

* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

html,
body {
  width: 100%;
  min-height: 100%;
  margin: 0;
}

html {
  background: var(--bg);
  font-family: "VT323", "Lucida Console", "Courier New", monospace;
  font-variant-ligatures: none;
  -webkit-font-smoothing: none;
}

body {
  min-height: 100svh;
  overflow: hidden;
  background: var(--bg);
  color: var(--text);
  font-size: var(--body-font-size);
  letter-spacing: 0.02em;
  text-rendering: optimizeSpeed;
  transition: background-color 120ms linear, color 120ms linear;
}

button {
  font: inherit;
}

.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 100;
  padding: 8px 10px;
  color: var(--ink);
  background: var(--primary);
  transform: translateY(-150%);
}

.skip-link:focus {
  transform: translateY(0);
}

.preboot .skip-link,
.preboot .signal-field,
.preboot .desktop,
.preboot .command-rail {
  visibility: hidden;
  opacity: 0;
}

.boot-screen {
  position: fixed;
  inset: 0;
  z-index: 100;
  overflow: hidden;
  padding: clamp(14px, 2vw, 30px);
  color: #c7c8c7;
  background: #000;
  font-family: "VT323", "Lucida Console", "Courier New", monospace;
  font-size: clamp(19px, 1.45vw, 27px);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: 0.025em;
  text-transform: uppercase;
  font-variant-ligatures: none;
  -webkit-font-smoothing: none;
  text-shadow: 1px 0 0 rgba(255, 255, 255, 0.09);
  transform-origin: center;
  animation: crt-power-on 620ms steps(9, end) both;
}

.boot-screen::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
  background: linear-gradient(180deg, transparent 49.7%, rgba(230, 240, 255, 0.88) 50%, transparent 50.3%);
  opacity: 0;
  animation: boot-beam 620ms steps(8, end) both;
}

.boot-screen::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  top: -18%;
  height: 16%;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(107, 120, 255, 0.045), transparent);
  animation: boot-sweep 2.6s linear infinite;
}

.boot-screen.is-exiting {
  animation: boot-handoff 280ms steps(5, end) both;
}

.os-handoff {
  position: fixed;
  inset: 0;
  z-index: 45;
  overflow: hidden;
  background: #000;
  pointer-events: none;
}

.os-handoff-mark {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 340px;
  height: 340px;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 0 12px var(--glow));
  will-change: transform, opacity, filter;
}

.os-handoff-mark i {
  position: absolute;
  inset: 0;
  background: var(--primary);
  -webkit-mask: url("assets/navi-logo.svg") center / contain no-repeat;
  mask: url("assets/navi-logo.svg") center / contain no-repeat;
}

.os-handoff-mark i:nth-child(1) { transform: translate(8px, 8px); opacity: 0.2; background: #222b37; }
.os-handoff-mark i:nth-child(2) { transform: translate(5px, 5px); opacity: 0.42; background: #3f4d55; }
.os-handoff-mark i:nth-child(3) { transform: translate(2px, 2px); opacity: 0.68; background: #74828d; }
.os-handoff-mark i:nth-child(4) { opacity: 1; }

.handoff-active .navi-identity {
  visibility: hidden;
}

.handoff-active .dock-channel,
.handoff-active .launcher,
.handoff-active .command-rail,
.handoff-active .signal-field,
.handoff-landed .dock-channel,
.handoff-landed .launcher,
.handoff-landed .command-rail,
.handoff-landed .signal-field {
  visibility: hidden;
  opacity: 0;
}

.handoff-active .navi-logo-model,
.handoff-landed .navi-logo-model {
  animation: none;
  transform: none;
}

.boot-header {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  max-width: 980px;
  animation: boot-register 180ms steps(3, end) 520ms both;
}

.boot-header strong,
.boot-header span {
  display: block;
}

.boot-header strong {
  color: #e1e1df;
  font-size: 1.16em;
  font-weight: 400;
  letter-spacing: 0.045em;
}

.boot-header span {
  margin-top: -1px;
  color: #8e9192;
  font-size: 0.86em;
}

.boot-emblem {
  position: relative;
  width: 30px;
  height: 31px;
  flex: 0 0 30px;
}

.boot-emblem i {
  position: absolute;
  display: block;
  width: 17px;
  height: 11px;
  background: #74828d;
  box-shadow: 0 0 5px rgba(116, 130, 141, 0.38);
  clip-path: polygon(18% 0, 100% 0, 82% 100%, 0 100%);
}

.boot-emblem i:nth-child(1) { top: 0; left: 2px; }
.boot-emblem i:nth-child(2) { top: 10px; left: 10px; }
.boot-emblem i:nth-child(3) { top: 20px; left: 0; }

.boot-version {
  position: relative;
  z-index: 1;
  margin: 28px 0 0;
  color: #8e9192;
  font-size: 0.86em;
  animation: boot-register 150ms steps(2, end) 650ms both;
}

.boot-log {
  position: relative;
  z-index: 1;
  width: min(980px, calc(100vw - 28px));
  margin-top: 22px;
}

.boot-line {
  display: grid;
  grid-template-columns: minmax(24ch, 34ch) minmax(12ch, 1fr);
  gap: 1ch;
  min-height: 1.04em;
  animation: boot-line-in 38ms steps(1, end) both;
}

.boot-line__label::after {
  content: " ...";
  color: #707374;
}

.boot-line__status {
  color: #e0e1df;
  white-space: nowrap;
}

.boot-line.is-warning .boot-line__status {
  color: #d6bf6d;
}

.boot-line.is-axiom,
.boot-line.is-final {
  display: block;
  max-width: 860px;
}

.boot-line.is-axiom {
  color: #9ea9b0;
  padding-left: 16px;
  border-left: 2px solid #74828d;
}

.boot-line.is-final {
  color: #e2e2df;
  letter-spacing: 0.05em;
}

.boot-gap {
  height: 0.72em;
}

.boot-prompt {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 18px;
  color: #8e9192;
  font-size: 0.86em;
  animation: boot-register 130ms steps(2, end) 720ms both;
}

.boot-prompt__mobile {
  display: none;
}

.boot-prompt__mobile button {
  padding: 0 2px;
  border: 0;
  color: var(--bg);
  background: var(--primary);
  font: inherit;
  letter-spacing: inherit;
  cursor: pointer;
}

.boot-prompt__mobile button:focus-visible {
  outline: 1px solid #fff;
  outline-offset: 3px;
}

.boot-prompt i {
  display: inline-block;
  width: 0.62em;
  height: 1em;
  background: #c7c8c7;
  animation: boot-cursor 620ms steps(1, end) infinite;
}

.boot-footer {
  position: absolute;
  right: clamp(14px, 2vw, 30px);
  bottom: clamp(12px, 1.6vw, 24px);
  left: clamp(14px, 2vw, 30px);
  z-index: 1;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  color: #8e9192;
  font-size: 0.78em;
  animation: boot-register 130ms steps(2, end) 760ms both;
}

.boot-footer button {
  padding: 0;
  border: 0;
  border-radius: 0;
  color: #d2d3d1;
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.boot-footer button:hover,
.boot-footer button:focus-visible {
  color: #fff;
  outline: 1px solid #74828d;
  outline-offset: 4px;
}

@keyframes boot-line-in {
  from { opacity: 0; transform: translateY(-1px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes boot-cursor {
  0%, 48% { opacity: 1; }
  49%, 100% { opacity: 0; }
}

@keyframes boot-sweep {
  from { transform: translateY(0); }
  to { transform: translateY(740%); }
}

@keyframes boot-handoff {
  0% { opacity: 1; filter: brightness(1); }
  65% { opacity: 1; filter: brightness(1.8); }
  100% { opacity: 0; filter: brightness(0); }
}

@keyframes crt-power-on {
  0% { opacity: 0; transform: scaleX(0.02) scaleY(0.004); filter: brightness(8); }
  24% { opacity: 1; transform: scaleX(1) scaleY(0.004); filter: brightness(6); }
  52% { transform: scaleX(1) scaleY(1); filter: brightness(2.4); }
  76% { filter: brightness(0.65); }
  100% { opacity: 1; transform: scale(1); filter: brightness(1); }
}

@keyframes boot-beam {
  0%, 18% { opacity: 0; transform: scaleX(0.04); }
  24%, 48% { opacity: 1; transform: scaleX(1); }
  72%, 100% { opacity: 0; transform: scaleX(1); }
}

@keyframes boot-register {
  from { opacity: 0; transform: translateX(-5px); filter: brightness(3); }
  to { opacity: 1; transform: translateX(0); filter: brightness(1); }
}

.signal-field {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 50% 44%, color-mix(in srgb, var(--primary) 5%, transparent) 0, transparent 42%),
    radial-gradient(ellipse at 50% 50%, transparent 35%, rgba(0, 0, 0, 0.32) 72%, rgba(0, 0, 0, 0.88) 100%),
    linear-gradient(180deg, color-mix(in srgb, var(--bg) 78%, #000) 0%, var(--bg) 48%, color-mix(in srgb, var(--bg) 72%, #000) 100%);
  opacity: 1;
}

.signal-field::before,
.signal-field::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 0 42%, color-mix(in srgb, var(--primary) 3%, transparent) 49%, transparent 57%);
  background-size: 100% 220px;
  opacity: 0.32;
  animation: phosphor-drift 11s linear infinite;
}

.background-art {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
}

.signal-field::before {
  z-index: 1;
}

.signal-field::after {
  inset: 10px;
  border: 1px solid color-mix(in srgb, var(--border) 28%, transparent);
  border-radius: 2.2% / 1.4%;
  background: none;
  box-shadow: inset 0 0 140px rgba(0, 0, 0, 0.7), 0 0 24px rgba(0, 0, 0, 0.7);
  opacity: 0.75;
  animation: none;
  z-index: 3;
}

.scanlines {
  position: fixed;
  inset: 0;
  z-index: 150;
  pointer-events: none;
  background:
    linear-gradient(rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.28) 50%),
    linear-gradient(90deg, rgba(116, 130, 141, 0.018), rgba(158, 169, 176, 0.008), rgba(63, 77, 85, 0.02));
  background-size: 100% 4px, 5px 100%;
  box-shadow: inset 0 0 110px rgba(0, 0, 0, 0.42);
  opacity: 0.62;
}

.telemetry {
  position: absolute;
  z-index: 2;
  color: var(--dim);
  font-size: 10px;
  letter-spacing: 0.15em;
  opacity: 0.1;
  animation: signal-drift 8s steps(2, end) infinite alternate;
}

.telemetry--a { top: 14%; left: 7%; }
.telemetry--b { top: 21%; right: 9%; animation-delay: -2s; }
.telemetry--c { bottom: 18%; left: 11%; animation-delay: -4s; }
.telemetry--d { right: 8%; bottom: 12%; animation-delay: -6s; }

.desktop {
  position: relative;
  z-index: 2;
  min-height: 100svh;
  display: grid;
  place-items: center start;
  padding: 30px 24px 64px 8px;
}

.dock-channel {
  position: fixed;
  top: 0;
  bottom: 34px;
  left: 0;
  z-index: 1;
  width: var(--dock-width);
  border-right: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.96), rgba(2, 5, 7, 0.86) 72%, rgba(2, 5, 7, 0.34)),
    repeating-linear-gradient(180deg, transparent 0 3px, rgba(158, 169, 176, 0.016) 3px 4px);
  box-shadow: 24px 0 54px rgba(0, 0, 0, 0.32);
  pointer-events: none;
}

.system-shell {
  position: fixed;
  top: 50%;
  left: var(--dock-center);
  z-index: 2;
  width: 216px;
  transform: translate(-50%, -50%) scale(var(--desktop-scale));
  text-align: center;
  transition: opacity 120ms linear, filter 120ms linear;
}

.navi-identity {
  position: relative;
  top: -17px;
  height: 150px;
  display: grid;
  justify-items: center;
  align-content: center;
  margin-bottom: 4px;
  color: var(--primary);
  font-size: 16px;
  line-height: 1;
  letter-spacing: 0.16em;
  text-shadow: 0 0 7px var(--glow);
}

.navi-logo-model {
  position: relative;
  width: 148px;
  height: 148px;
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  animation: navi-logo-float 4.6s steps(8, end) infinite alternate;
  filter: drop-shadow(0 0 7px var(--glow));
}

.navi-logo-model:focus-visible {
  outline: 1px solid var(--primary);
  outline-offset: 4px;
}

.navi-logo-model.is-activated {
  animation: navi-logo-turntable 1050ms linear both;
}

.navi-logo-model i {
  position: absolute;
  inset: 0;
  display: block;
  background: var(--primary);
  -webkit-mask: url("assets/navi-logo.svg") center / contain no-repeat;
  mask: url("assets/navi-logo.svg") center / contain no-repeat;
}

.navi-logo-model i:nth-child(1) { transform: translate(6px, 6px); opacity: 0.2; background: #222b37; }
.navi-logo-model i:nth-child(2) { transform: translate(4px, 4px); opacity: 0.42; background: #3f4d55; }
.navi-logo-model i:nth-child(3) { transform: translate(2px, 2px); opacity: 0.68; background: #74828d; }
.navi-logo-model i:nth-child(4) { transform: translate(0); opacity: 1; }

.window-open .system-shell {
  opacity: 1;
  filter: none;
}

.launcher-grid {
  position: relative;
  top: -12px;
  display: grid;
  grid-template-columns: 216px;
  grid-auto-rows: 112px;
  gap: 2px;
}

.launcher {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 216px;
  height: 112px;
  padding: 7px 12px;
  border: 0;
  border-radius: 0;
  color: #87959f;
  background: transparent;
  cursor: pointer;
  outline: 0;
  perspective: 180px;
  transition: color 120ms linear, transform 90ms steps(2, end);
}

.launcher:hover,
.launcher:focus-visible,
.launcher.is-selected {
  color: var(--primary);
}

.launcher:active {
  transform: translateY(1px);
}

.folder-icon {
  position: relative;
  width: 64px;
  height: 66px;
  flex: 0 0 66px;
  display: block;
  color: #87959f;
  transform-style: preserve-3d;
  will-change: transform;
  filter: drop-shadow(0 0 5px color-mix(in srgb, currentColor 35%, transparent));
}

.folder-icon i,
.folder-icon b {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 48px;
  height: 48px;
  margin: -24px 0 0 -24px;
  border: 0;
  background: currentColor;
  color: inherit;
  font-size: 0;
  transform-style: preserve-3d;
  -webkit-mask: var(--app-icon) center / contain no-repeat;
  mask: var(--app-icon) center / contain no-repeat;
}

.folder-icon i:nth-child(1) { transform: translate3d(7px, 7px, -9px); opacity: 0.18; }
.folder-icon i:nth-child(2) { transform: translate3d(5px, 5px, -5px); opacity: 0.34; }
.folder-icon i:nth-child(3) { transform: translate3d(3px, 3px, -1px); opacity: 0.58; }
.folder-icon b { transform: translateZ(5px); opacity: 1; }

.launcher[data-folder="profile"] { --app-icon: url("assets/pixelarticons/user.svg"); }
.launcher[data-folder="news"] { --app-icon: url("assets/news.svg"); }
.launcher[data-folder="navigator"] { --app-icon: url("assets/navigator-globe.svg"); }
.launcher[data-folder="navichan"] { --app-icon: url("assets/pixelarticons/wifi.svg"); }
.launcher[data-folder="notes"] { --app-icon: url("assets/pixelarticons/notebook.svg"); }
.launcher[data-folder="contact"] { --app-icon: url("assets/pixelarticons/mail.svg"); }
.launcher[data-folder="apps"] { --app-icon: url("assets/pixelarticons/folder.svg"); }
.launcher[data-folder="guestbook"] { --app-icon: url("assets/pixelarticons/radio.svg"); }
.launcher[data-folder="mail"] { --app-icon: url("assets/pixelarticons/mail.svg"); }

.launcher:hover .folder-icon,
.launcher:focus-visible .folder-icon,
.launcher.is-selected .folder-icon {
  color: var(--primary);
  filter: drop-shadow(0 0 8px var(--glow));
}

.launcher-label {
  position: relative;
  z-index: 2;
  min-width: 108px;
  padding: 2px 12px 1px;
  color: #87959f;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: color 90ms linear, background-color 90ms steps(2, end), transform 90ms steps(2, end);
}

.launcher:hover .launcher-label,
.launcher:focus-visible .launcher-label,
.window-open .launcher.is-selected .launcher-label {
  color: var(--ink);
  background: var(--primary);
  clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%);
  filter: drop-shadow(4px 0 0 color-mix(in srgb, var(--primary) 34%, transparent));
  transform: translateX(2px);
}

.app-window {
  position: fixed;
  top: var(--window-y, 50%);
  left: var(--window-x, 50%);
  z-index: 10;
  width: min(var(--window-width), calc(100vw - 28px));
  max-height: min(var(--window-max-height), calc(100svh - 100px));
  overflow: hidden;
  border: 1px solid var(--primary);
  background: var(--bg);
  box-shadow: 12px 14px 0 rgba(0, 0, 0, 0.32), 0 0 26px var(--shadow), 0 0 8px var(--glow);
  transform: translate(-50%, -50%);
  transform-origin: center;
  will-change: transform, opacity;
}

.app-window.is-opening {
  animation: window-resolve 120ms steps(3, end) both;
}

.app-window.is-closing {
  pointer-events: none;
  animation: window-dismiss 180ms steps(4, end) both;
}

.system-terminal {
  top: var(--window-y, 50%);
  left: var(--window-x, 50%);
  width: min(var(--terminal-width), calc(100vw - 36px));
  height: min(var(--terminal-height), calc(100svh - 100px));
  display: grid;
  grid-template-rows: 29px 1fr 36px;
  overflow: hidden;
  border: 1px solid var(--primary);
  background: color-mix(in srgb, var(--bg) 96%, transparent);
  box-shadow: 10px 12px 0 rgba(0, 0, 0, 0.34), 0 0 24px var(--shadow);
  transform: translate(-50%, -50%);
  transform-origin: center;
}

.system-terminal[hidden] { display: none; }

.system-terminal.is-opening { animation: window-resolve 120ms steps(3, end) both; }
.system-terminal.is-closing { animation: window-dismiss 180ms steps(4, end) both; pointer-events: none; }

.system-terminal__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 10px;
  color: var(--ink);
  background: var(--primary);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.system-terminal__close {
  width: 25px;
  height: 21px;
  margin-right: 4px;
  padding: 0;
  border: 1px solid var(--ink);
  color: var(--primary);
  background: var(--ink);
  font: inherit;
  line-height: 17px;
  cursor: pointer;
}

.system-terminal__output {
  overflow-y: auto;
  padding: 12px 14px;
  color: color-mix(in srgb, var(--text) 76%, var(--primary));
  font-size: 14px;
  line-height: 1.65;
  scrollbar-color: var(--border) var(--bg);
  scrollbar-width: thin;
}

.system-terminal__line { min-height: 1.65em; white-space: pre-wrap; overflow-wrap: anywhere; }
.system-terminal__line--command { color: var(--primary); }
.system-terminal__line--muted { color: var(--dim); }
.system-terminal__line--error { color: #d8a0a0; }

.system-terminal__form {
  display: grid;
  grid-template-columns: max-content 1fr;
  align-items: center;
  gap: 8px;
  padding: 0 13px;
  border-top: 1px solid var(--border);
  color: var(--primary);
  font-size: 14px;
}

.system-terminal__form input {
  min-width: 0;
  padding: 0;
  border: 0;
  outline: 0;
  color: var(--text);
  background: transparent;
  font: inherit;
  caret-color: var(--primary);
}

.window-titlebar {
  position: relative;
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 7px 0 12px;
  color: var(--ink);
  background: var(--primary);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.12em;
  overflow: hidden;
  cursor: grab;
  user-select: none;
  touch-action: none;
}

.app-window.is-dragging .window-titlebar {
  cursor: grabbing;
}

.window-titlebar::after {
  content: "";
  position: absolute;
  top: 0;
  right: 46px;
  width: 52px;
  height: 100%;
  background: repeating-linear-gradient(135deg, transparent 0 6px, color-mix(in srgb, var(--ink) 26%, transparent) 6px 9px);
}

.window-close {
  position: relative;
  z-index: 1;
  width: 22px;
  height: 20px;
  padding: 0;
  border: 1px solid var(--ink);
  border-radius: 0;
  color: var(--primary);
  background: var(--ink);
  cursor: pointer;
  line-height: 16px;
}

.window-close:focus-visible {
  outline: 1px solid var(--ink);
  outline-offset: 2px;
}

.window-path {
  padding: 8px 12px;
  border-bottom: 1px solid var(--border);
  color: var(--dim);
  font-size: 13px;
  letter-spacing: 0.08em;
}

.window-body {
  min-height: 270px;
  max-height: calc(min(560px, calc(100svh - 100px)) - 93px);
  overflow: auto;
  padding: 20px;
  color: color-mix(in srgb, var(--text) 70%, var(--primary));
  font-size: 16px;
  line-height: 1.75;
  text-align: left;
  scrollbar-color: var(--border) var(--bg);
  scrollbar-width: thin;
}

.window-body h2 {
  margin: 0 0 14px;
  color: var(--primary);
  font-size: 15px;
  letter-spacing: 0.08em;
}

.window-body p {
  margin: 0 0 14px;
}

.window-body ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.window-body li {
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: 18px;
  padding: 8px 0;
  border-top: 1px solid color-mix(in srgb, var(--border) 58%, transparent);
}

.window-body li span:first-child {
  color: var(--primary);
}

.window-body a {
  color: var(--primary);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.news-window {
  width: min(900px, calc(100vw - 36px));
  height: min(650px, calc(100svh - 54px));
  max-height: calc(100svh - 54px);
  display: grid;
  grid-template-rows: 30px auto minmax(0, 1fr) 29px;
}

.news-window .window-body {
  min-height: 0;
  max-height: none;
  padding: 0;
  line-height: 1.35;
}

.navi-news {
  min-height: 100%;
  color: var(--text);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--primary) 9%, transparent), transparent 42%),
    var(--bg);
}

.navi-news__masthead {
  position: relative;
  min-height: 112px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 15px 18px;
  overflow: hidden;
  border-bottom: 4px double var(--primary);
  background:
    repeating-linear-gradient(90deg, transparent 0 36px, color-mix(in srgb, var(--primary) 8%, transparent) 36px 38px),
    linear-gradient(110deg, color-mix(in srgb, var(--primary) 23%, var(--bg)), var(--bg) 64%);
}

.navi-news__masthead::after {
  content: "";
  position: absolute;
  top: -40px;
  right: 15%;
  width: 190px;
  height: 190px;
  border: 22px solid color-mix(in srgb, var(--primary) 12%, transparent);
  transform: skewX(-24deg) rotate(18deg);
}

.navi-news__station,
.navi-news__signal {
  position: relative;
  z-index: 1;
}

.navi-news__station {
  display: flex;
  align-items: center;
  gap: 13px;
}

.navi-news__station > span {
  padding: 7px 9px 3px;
  color: var(--ink);
  background: var(--primary);
  font-size: 29px;
  font-weight: 700;
  letter-spacing: -0.08em;
  transform: skewX(-8deg);
}

.navi-news__station div {
  display: grid;
}

.navi-news__station strong {
  color: var(--primary);
  font-size: 34px;
  line-height: 0.9;
  letter-spacing: 0.07em;
  text-shadow: 4px 3px 0 var(--ink), 0 0 10px var(--glow);
}

.navi-news__station small {
  margin-top: 8px;
  color: var(--dim);
  font-family: "MS Gothic", "Yu Gothic", sans-serif;
  font-size: 11px;
  letter-spacing: 0.18em;
}

.navi-news__signal {
  display: grid;
  justify-items: end;
  gap: 5px;
  color: var(--dim);
  font-size: 11px;
  letter-spacing: 0.12em;
}

.navi-news__signal b {
  padding: 2px 8px;
  color: var(--ink);
  background: var(--primary);
}

.navi-news__nav {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-bottom: 1px solid var(--primary);
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 12%, var(--bg));
  font-family: "MS Gothic", "Yu Gothic", sans-serif;
  font-size: 11px;
  text-align: center;
}

.navi-news__nav span {
  padding: 5px 8px;
  border-right: 1px solid color-mix(in srgb, var(--border) 62%, transparent);
}

.navi-news__ticker {
  display: flex;
  min-width: 0;
  border-bottom: 1px solid var(--border);
  background: var(--ink);
  font-size: 12px;
  letter-spacing: 0.06em;
}

.navi-news__ticker b {
  flex: 0 0 auto;
  padding: 4px 10px;
  color: var(--ink);
  background: var(--primary);
}

.navi-news__ticker > div {
  min-width: 0;
  display: flex;
  overflow: hidden;
  color: var(--dim);
  white-space: nowrap;
}

.navi-news__ticker span {
  flex: 0 0 auto;
  min-width: 0;
  padding: 4px 10px;
  animation: news-wire-scroll 24s linear infinite;
}

.navi-news__section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 7px 11px 5px;
  border-bottom: 1px solid var(--primary);
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 7%, var(--bg));
}

.navi-news__section-title strong {
  font-size: 17px;
  letter-spacing: 0.1em;
}

.navi-news__index {
  min-height: 0;
}

.navi-news__index-entries {
  padding: 6px 8px 18px;
}

.navi-news__entry {
  width: 100%;
  display: grid;
  grid-template-columns: 38px 88px 74px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-height: 31px;
  padding: 3px 5px;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  color: var(--text);
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.navi-news__entry:hover,
.navi-news__entry:focus-visible {
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 8%, transparent);
  outline: 0;
}

.navi-news__new {
  padding: 1px 3px 0;
  color: var(--ink);
  background: var(--primary);
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}

.navi-news__entry:not(:first-child) .navi-news__new {
  color: var(--dim);
  background: transparent;
  border: 1px solid var(--border);
}

.navi-news__entry time,
.navi-news__category {
  color: var(--dim);
  font-size: 11px;
  letter-spacing: 0.05em;
}

.navi-news__category {
  color: var(--primary);
}

.navi-news__entry strong {
  min-width: 0;
  overflow: hidden;
  font-size: 15px;
  letter-spacing: 0.04em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.navi-news__readers {
  min-height: 0;
}

.navi-news__article[hidden] {
  display: none;
}

.navi-news__article-nav {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 6px 10px;
  border-bottom: 1px solid var(--primary);
  background: color-mix(in srgb, var(--primary) 11%, var(--bg));
}

.navi-news__article-nav button {
  padding: 2px 6px;
  border: 0;
  color: var(--primary);
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.navi-news__article-nav button:hover,
.navi-news__article-nav button:focus-visible {
  color: var(--ink);
  background: var(--primary);
  outline: 0;
}

.navi-news__article-nav span {
  color: var(--dim);
  font-size: 11px;
  letter-spacing: 0.08em;
}

.navi-news__article-body {
  width: min(720px, calc(100% - 32px));
  margin: 0 auto;
  padding: 26px 0 42px;
  color: color-mix(in srgb, var(--text) 78%, var(--primary));
  font-size: 14px;
  line-height: 1.65;
}

.navi-news__article-body h1 {
  margin: 3px 0 12px;
  padding-bottom: 9px;
  border-bottom: 3px double var(--primary);
  color: var(--primary);
  font-size: 29px;
  line-height: 1;
  letter-spacing: 0.06em;
}

.navi-news__article-body > p {
  margin: 0 0 14px;
}

.navi-news__article-body figure {
  margin: 20px 0;
  padding: 5px;
  border: 1px solid var(--border);
  background: #000;
}

.navi-news__article-body img {
  display: block;
  width: 100%;
  max-height: 360px;
  object-fit: contain;
  background: #000;
}

.navi-news__article-body figcaption {
  padding: 5px 4px 1px;
  color: var(--dim);
  font-size: 10px;
  letter-spacing: 0.09em;
}

.navi-news__dek {
  color: var(--primary);
  font-weight: 700;
}

@keyframes news-wire-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}

.navigator-window {
  width: min(980px, calc(100vw - 36px));
  height: min(690px, calc(100svh - 54px));
  max-height: calc(100svh - 54px);
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
}

.navigator-window .window-body { min-height: 0; height: 100%; max-height: none; padding: 0; overflow: hidden; }
.navigator { min-height: 100%; color: #87959f; background: #05090d; }
.navigator button, .navigator input { border-radius: 0; font: inherit; }
.navigator-masthead { min-height: 105px; display: flex; align-items: center; justify-content: space-between; padding: 15px 20px; border-bottom: 4px double var(--primary); background: linear-gradient(110deg, #101a23 0 28%, #22313d 28% 45%, #0b1118 45%); }
.navigator-wordmark { display: flex; align-items: center; gap: 13px; }
.navigator-wordmark > b { display: grid; place-items: center; width: 62px; height: 55px; border: 1px solid var(--primary); color: #071018; background: var(--primary); font-size: 49px; line-height: 1; transform: skewX(-8deg); box-shadow: 7px 6px 0 #17232c; }
.navigator-wordmark span { display: grid; }
.navigator-wordmark strong { color: var(--primary); font-size: 37px; line-height: .8; letter-spacing: .08em; text-shadow: 3px 3px 0 #111a22; }
.navigator-wordmark small { margin-top: 10px; color: #aeb9bf; font-size: 12px; letter-spacing: .15em; }
.navigator-status { display: grid; min-width: 78px; padding: 5px 8px; border: 1px solid var(--primary); text-align: right; }
.navigator-status span { color: var(--dim); font-size: 10px; letter-spacing: .12em; }
.navigator-status strong { color: var(--primary); font-size: 23px; }
.navigator-search { display: grid; grid-template-columns: auto minmax(0, 1fr) 62px; align-items: center; gap: 8px; padding: 7px 12px; border-bottom: 1px solid var(--border); background: #10171e; }
.navigator-search label { color: var(--primary); font-size: 13px; }
.navigator-search input { min-width: 0; height: 25px; padding: 1px 7px; border: 1px solid #53616b; color: #d3d9dc; background: #020507; outline: 0; }
.navigator-search input:focus { border-color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); }
.navigator-search button, .navigator-tabs button, .navigator-page button { border: 1px solid var(--border); color: var(--primary); background: #080d12; cursor: pointer; }
.navigator-search button:hover, .navigator-search button:focus-visible, .navigator-tabs button:hover, .navigator-tabs button:focus-visible, .navigator-tabs button.is-active, .navigator-page button:hover, .navigator-page button:focus-visible { color: #071018; background: var(--primary); outline: 0; }
.navigator-tabs { display: flex; min-width: max-content; border-bottom: 1px solid var(--primary); background: #080d12; }
.navigator-tabs button { flex: 1; min-height: 29px; padding: 3px 11px; border-width: 0 1px 0 0; font-size: 12px; }
.navigator-layout { display: grid; grid-template-columns: 190px minmax(0, 1fr); min-height: 400px; }
.navigator-layout aside { padding: 12px 10px; border-right: 1px solid var(--border); background: #0b1117; }
.navigator-layout aside > strong { display: block; padding-bottom: 4px; border-bottom: 1px solid var(--primary); color: var(--primary); font-size: 14px; }
.navigator-layout aside p { margin: 8px 0 14px; color: var(--dim); font-size: 12px; }
.navigator-layout dl { display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; margin: 0; font-size: 11px; }
.navigator-layout dt { color: #65737c; }.navigator-layout dd { margin: 0; color: var(--primary); }
.navigator-notice { margin-top: 22px; padding: 8px; border: 1px dotted #53616b; color: #65737c; font-size: 11px; line-height: 1.35; }
.navigator-layout main { min-width: 0; }
.navigator-list-head { display: flex; justify-content: space-between; padding: 6px 9px; color: #071018; background: var(--primary); }
.navigator-list-head span { font-size: 11px; }
.navigator-entry { display: grid; grid-template-columns: 18px minmax(0, 1fr) 74px; align-items: start; gap: 7px; width: 100%; padding: 9px 10px 8px; border: 0; border-bottom: 1px dotted #36424b; color: #87959f; background: transparent; text-align: left; cursor: pointer; }
.navigator-entry:hover, .navigator-entry:focus-visible { color: var(--primary); background: #111a22; outline: 0; }
.navigator-entry__mark { color: var(--primary); }.navigator-entry span:nth-child(2) { display: grid; min-width: 0; }
.navigator-entry strong { color: #b8c1c6; font-size: 16px; letter-spacing: .04em; text-decoration: underline; text-underline-offset: 2px; }
.navigator-entry small { margin-top: 3px; overflow: hidden; color: #65737c; font-size: 12px; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
.navigator-entry time { color: #53616b; font-size: 10px; text-align: right; }
.navigator-empty { padding: 28px 12px; color: #65737c; text-align: center; }
.navigator-page[hidden], .navigator-empty[hidden], .navigator-layout aside[hidden], .navigator-entries[hidden], .navigator-list-head[hidden] { display: none; }
.navigator-page header { display: flex; justify-content: space-between; align-items: center; padding: 6px 9px; border-bottom: 1px solid var(--primary); background: #101820; }
.navigator-page header button { padding: 2px 6px; border: 0; }.navigator-page header span { color: var(--dim); font-size: 10px; }
.navigator-page__body { width: min(650px, calc(100% - 30px)); margin: 0 auto; padding: 24px 0 40px; font-size: 14px; line-height: 1.55; }
.navigator-page__jp { margin: 0; color: var(--dim); letter-spacing: .18em; }
.navigator-page h1 { margin: 2px 0 8px; padding-bottom: 7px; border-bottom: 3px double var(--primary); color: var(--primary); font-size: 29px; line-height: 1; }
.navigator-page__summary { color: #b8c1c6; font-weight: 700; }.navigator-page__body > p { margin: 0 0 13px; }
.navigator-page nav { display: grid; gap: 5px; margin-top: 22px; }.navigator-page nav button { padding: 5px 7px; text-align: left; }
.navigator > footer { padding: 5px 9px; border-top: 1px solid var(--border); color: #53616b; font-size: 10px; }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.navigator-v2 { min-height: 0; height: 100%; display: grid; grid-template-rows: 31px 35px minmax(0, 1fr); overflow: hidden; }
.navigator-browser-tabs { display: flex; min-width: 0; border-bottom: 1px solid var(--primary); background: #080d12; }
.navigator-browser-tabs__items { display: flex; min-width: 0; flex: 0 1 auto; overflow-x: auto; }
.navigator-browser-tab { display: flex; flex: 0 1 170px; width: 170px; min-width: 92px; max-width: 170px; border-right: 1px solid var(--border); background: #0b1117; }
.navigator-browser-tab.is-active { background: color-mix(in srgb, var(--primary) 14%, #080d12); }
.navigator-browser-tab > button { min-width: 0; border: 0; color: #65737c; background: transparent; cursor: pointer; }
.navigator-browser-tab > button:first-child { flex: 1; padding: 4px 8px; overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.navigator-browser-tab > button:last-child { width: 25px; color: var(--dim); }
.navigator-browser-tab.is-active > button:first-child { color: var(--primary); }
.navigator-browser-tab > button:first-child:hover, .navigator-browser-tab > button:first-child:focus-visible { color: var(--primary); background: color-mix(in srgb, var(--primary) 12%, #080d12); outline: 0; }
.navigator-browser-tab > button:last-child:hover, .navigator-browser-tab > button:last-child:focus-visible, .navigator-new-tab:hover, .navigator-new-tab:focus-visible { color: #071018; background: var(--primary); outline: 0; }
.navigator-new-tab { flex: 0 0 34px; width: 34px; border: 0; border-right: 1px solid var(--border); color: var(--primary); background: #080d12; font-size: 20px; cursor: pointer; }
.navigator-new-tab:disabled { color: var(--dim); background: #080d12; cursor: not-allowed; }
.navigator-browser-toolbar { display: grid; grid-template-columns: 34px 34px minmax(120px, 1fr) 36px auto auto; min-width: 0; border-bottom: 1px solid var(--border); background: #080d12; }
.navigator-browser-toolbar > button, .navigator-address-form button { border: 0; border-right: 1px solid var(--border); color: #87959f; background: #080d12; cursor: pointer; line-height: 1; }
.navigator-browser-toolbar > button:hover, .navigator-browser-toolbar > button:focus-visible, .navigator-address-form button:hover, .navigator-address-form button:focus-visible { color: #071018; background: var(--primary); outline: 0; }
.navigator-browser-toolbar > button:disabled { color: #3e4850; background: #080d12; cursor: default; }
.navigator-browser-toolbar > button[data-navigator-back], .navigator-browser-toolbar > button[data-navigator-forward] { font-size: 17px; }
.navigator-address-form { display: grid; grid-template-columns: minmax(0, 1fr) 35px; min-width: 0; margin: 3px 0; border: 1px solid #34414a; background: #020507; }
.navigator-address-form input { min-width: 0; padding: 3px 8px; border: 0; border-right: 1px solid var(--border); color: #c4cdd2; background: #020507; outline: 0; }
.navigator-address-form input:focus { box-shadow: inset 0 0 0 1px var(--primary); }
.navigator-address-form button { border-right: 0; color: var(--primary); font-size: 17px; }
.navigator-browser-toolbar > button[data-navigator-library] { padding: 0 9px; font-size: 12px; letter-spacing: .04em; }
.navigator-bookmark-toggle { color: var(--primary) !important; font-size: 19px; }
.navigator-bookmark-toggle.is-bookmarked { background: color-mix(in srgb, var(--primary) 14%, #080d12); text-shadow: 0 0 5px color-mix(in srgb, var(--primary) 70%, transparent); }
.navigator-bookmark-toggle:disabled { color: #3e4850 !important; text-shadow: none; }
.navigator-bookmark-toggle:hover, .navigator-bookmark-toggle:focus-visible { color: #071018 !important; text-shadow: none; }
.navigator-tab-viewport { min-height: 0; overflow: auto; background: #05090d; }
.navigator-index { min-height: 0; height: 100%; }
.navigator-v2 .navigator-tabs { position: sticky; top: 0; z-index: 3; width: 100%; min-width: 0; }
.navigator-v2 .navigator-tabs button { position: relative; flex: 1; min-height: 34px; overflow: hidden; font-size: 13px; letter-spacing: .06em; }
.navigator-v2 .navigator-tabs button::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--primary); opacity: .22; }
.navigator-v2 .navigator-tabs button.is-active::before { opacity: 1; box-shadow: 5px 0 0 color-mix(in srgb, var(--primary) 25%, transparent); }
.navigator-v2 .navigator-tabs button[data-navigator-view="NAVINET"] { font-size: 0; }
.navigator-v2 .navigator-tabs button[data-navigator-view="NAVINET"]::after { content: "NAVINET"; font-size: 13px; }
.navigator-v2 .navigator-tabs .navigator-locked { color: #65737c; }
.navigator-v2 .navigator-tabs .navigator-locked.is-denied { animation: navigator-access-denied 280ms steps(5, end); color: #d8a0a0; }
.navigator-search-home { min-height: 0; height: calc(100% - 34px); display: grid; place-content: center; justify-items: center; padding: 30px 20px 62px; }
.navigator-search-home[hidden], .navigator-directory[hidden], .navigator-neighbors[hidden] { display: none; }
.navigator-search-logo { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.navigator-search-logo b { position: relative; display: block; width: 76px; height: 64px; overflow: visible; color: #071018; background: var(--primary); font-size: 0; transform: skewX(-8deg); box-shadow: 7px 6px 0 #17232c; }
.navigator-search-logo b::after { content: "N"; position: absolute; top: 50%; left: 50%; color: var(--bg); font-size: 133px; font-weight: 700; line-height: .58; transform: translate(-50%, -50%); }
.navigator-search-logo strong { color: var(--primary); font-size: 0; letter-spacing: .08em; text-shadow: 3px 3px 0 #111a22; }
.navigator-search-logo strong::after { content: "AVIGATOR"; font-size: 42px; }
.navigator-v2 .navigator-search { width: min(620px, calc(100vw - 90px)); grid-template-columns: minmax(0, 1fr) 82px; padding: 0; border: 1px solid #53616b; background: #020507; box-shadow: 0 0 14px rgba(91, 112, 126, .16); }
.navigator-v2 .navigator-search input { height: 34px; border: 0; }
.navigator-v2 .navigator-search button { height: 34px; border-width: 0 0 0 1px; }
.navigator-search-home > small { margin-top: 10px; color: #53616b; letter-spacing: .12em; }
.navigator-directory { padding: 14px 18px 28px; }
.navigator-v2 .navigator-entry { position: relative; display: block; padding: 13px 42px 12px 52px; border-left: 1px solid var(--border); }
.navigator-v2 .navigator-entry::before { content: "※"; position: absolute; top: 50%; left: 15px; width: auto; height: auto; color: var(--dim); font-size: 23px; line-height: 1; opacity: .9; transform: translateY(-50%); }
.navigator-v2 .navigator-entry:hover::before, .navigator-v2 .navigator-entry:focus-visible::before { color: var(--primary); opacity: 1; }
.navigator-v2 .navigator-entry::after { content: ">"; position: absolute; top: 50%; right: 15px; color: var(--dim); font-size: 20px; transform: translateY(-50%); }
.navigator-v2 .navigator-entry:hover::after, .navigator-v2 .navigator-entry:focus-visible::after { right: 10px; color: var(--primary); }
.navigator-v2 .navigator-entry strong { display: block; color: #b8c1c6; font-size: 17px; text-decoration: none; }
.navigator-v2 .navigator-entry strong span { color: var(--primary); font-weight: 400; }
.navigator-v2 .navigator-entry small { display: block; margin-top: 4px; color: #7f8d96; font-size: 15px; line-height: 1.2; white-space: normal; }
.navigator-neighbors { padding: 36px 22px; color: #65737c; }
.navigator-neighbors h2 { margin: 0 0 7px; color: var(--primary); font-size: 22px; }

.neighbor-self {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  padding-bottom: 22px;
  border-bottom: 1px solid var(--border);
}

.neighbor-self__button {
  display: block;
  width: 88px;
  height: 31px;
  border: 1px solid var(--border);
  background: #05090d;
  line-height: 0;
}

.neighbor-self__button img {
  display: block;
  width: 88px;
  height: 31px;
  image-rendering: pixelated;
}

.neighbor-self__button:hover,
.neighbor-self__button:focus-visible {
  border-color: var(--primary);
  outline: 0;
}

.neighbor-self__code {
  display: block;
  padding: 8px 10px;
  border: 1px solid var(--border);
  background: #05090d;
  color: #7f8d96;
  font-size: 13px;
  line-height: 1.5;
  overflow-wrap: anywhere;
  cursor: pointer;
}

.neighbor-self__code:hover {
  border-color: var(--primary);
  color: var(--primary);
}

.navigator-neighbors .neighbor-list__heading { margin: 22px 0 10px; }

.neighbor-list { display: grid; }

.neighbor-entry {
  display: grid;
  gap: 3px;
  padding: 11px 13px;
  border-left: 1px solid var(--border);
  color: inherit;
  text-decoration: none;
}

.neighbor-entry strong { color: var(--primary); font-weight: 400; font-size: 17px; }
.neighbor-entry small { color: #7f8d96; font-size: 14px; line-height: 1.35; }

.neighbor-entry:hover,
.neighbor-entry:focus-visible {
  border-left-color: var(--primary);
  background: color-mix(in srgb, var(--primary) 8%, transparent);
  outline: 0;
}

.neighbor-entry:hover strong,
.neighbor-entry:focus-visible strong { text-decoration: underline; }

.navigator-neighbors__empty { margin: 0; }
.navigator-library { min-height: 100%; padding: 18px; background: #05090d; }
.navigator-library[hidden], .navigator-domain-error[hidden] { display: none; }
.navigator-library > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 0 12px; border-bottom: 1px solid var(--primary); }
.navigator-library > header div { display: grid; }
.navigator-library > header strong { color: var(--primary); font-size: 22px; }
.navigator-library > header small { color: var(--dim); letter-spacing: .08em; }
.navigator-library > header button, .navigator-library li > button { border: 1px solid var(--border); color: #87959f; background: #080d12; cursor: pointer; }
.navigator-library > header button { padding: 4px 9px; }
.navigator-library > header button:hover, .navigator-library > header button:focus-visible, .navigator-library li > button:hover, .navigator-library li > button:focus-visible { color: #071018; background: var(--primary); outline: 0; }
.navigator-library > ol { display: grid; margin: 0; padding: 0; list-style: none; }
.navigator-library li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px dotted var(--border); }
.navigator-library li > button:first-child { display: grid; min-width: 0; padding: 6px 8px; text-align: left; }
.navigator-library li > button:first-child strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.navigator-library li > button:first-child span { color: var(--primary); }
.navigator-library li > small { color: var(--dim); white-space: nowrap; }
.navigator-library > p { color: #65737c; }
.navigator-domain-error { min-height: 100%; padding: 48px 54px; color: #b8c1c6; background: #05090d; }
.navigator-domain-error h1 { margin: 0 0 18px; color: var(--primary); font-size: 32px; font-weight: 400; line-height: 1.1; }
.navigator-domain-error p { margin: 0 0 18px; color: #87959f; font-size: 17px; line-height: 1.35; }
.navigator-domain-error code { color: #c4cdd2; font: inherit; overflow-wrap: anywhere; }
.navigator-domain-error hr { height: 1px; margin: 24px 0 10px; border: 0; background: var(--border); }
.navigator-domain-error .navigator-domain-error__server { margin-bottom: 14px; color: var(--dim); font-size: 14px; }
.navigator-domain-error nav { display: flex; align-items: center; gap: 5px; }
.navigator-domain-error nav button { padding: 0; border: 0; color: var(--primary); background: transparent; font: inherit; font-size: 16px; text-decoration: underline; cursor: pointer; }
.navigator-domain-error nav button:hover, .navigator-domain-error nav button:focus-visible { color: #d3d9dc; outline: 1px dotted var(--primary); outline-offset: 2px; }
.navigator-site { min-height: 100%; }
.navigator-site[hidden] { display: none; }
.navigator-site:not(.navigator-site--news) { padding: 0 0 50px; background: #05090d; }
.navigator-site:not(.navigator-site--news) > header { padding: 38px clamp(20px, 6vw, 72px) 26px; border-bottom: 1px solid var(--border); background: #0b1117; }
.navigator-site:not(.navigator-site--news) > header small { color: var(--dim); letter-spacing: .1em; }
.navigator-site:not(.navigator-site--news) h1 { margin: 7px 0 8px; color: var(--primary); font-size: clamp(30px, 5vw, 52px); line-height: .95; letter-spacing: .05em; }
.navigator-site:not(.navigator-site--news) > header p { max-width: 680px; margin: 0; color: #b8c1c6; font-size: 16px; }
.navigator-site__body { width: min(720px, calc(100% - 40px)); margin: 0 auto; padding: 30px 0; color: #87959f; font-size: 15px; line-height: 1.6; }
.navigator-site__body nav { display: grid; gap: 6px; margin-top: 28px; }
.navigator-site__body nav button { padding: 7px 9px; border: 1px solid var(--border); color: var(--primary); background: #080d12; font: inherit; text-align: left; cursor: pointer; }
.navigator-site__body nav button:hover, .navigator-site__body nav button:focus-visible { color: #071018; background: var(--primary); outline: 0; }
.navigator-site--news .navi-news { min-height: 100%; }

@keyframes navigator-access-denied {
  0%, 100% { text-shadow: 0 0 0 transparent; filter: none; }
  20% { text-shadow: -4px 0 0 #d8a0a0; filter: brightness(1.45); }
  40% { text-shadow: 4px 0 0 #d8a0a0; }
  60% { text-shadow: -2px 0 0 #d8a0a0; }
  80% { text-shadow: 2px 0 0 #d8a0a0; }
}

.navichan-window {
  width: min(var(--navichan-width), calc(100vw - 36px));
  height: min(var(--navichan-height), calc(100svh - 54px));
  max-height: calc(100svh - 54px);
  display: grid;
  grid-template-rows: 30px auto minmax(0, 1fr) 29px;
}

.navichan-window .window-body {
  min-height: 0;
  max-height: none;
  padding: 0;
  line-height: 1.35;
}

.navichan {
  min-height: 100%;
  color: var(--text);
  background: color-mix(in srgb, var(--bg) 97%, var(--primary));
}

.navichan-head {
  position: sticky;
  top: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 9px 13px;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 94%, var(--primary));
}

.navichan-head div {
  display: flex;
  align-items: baseline;
  gap: 12px;
}

.navichan-head strong {
  color: var(--primary);
  font-size: 18px;
  letter-spacing: 0.12em;
}

.navichan-head span,
.navichan-state,
.navichan-form-status {
  color: var(--dim);
  font-size: 12px;
  letter-spacing: 0.08em;
}

.navichan button,
.navichan input,
.navichan textarea {
  border-radius: 0;
  font: inherit;
}

.navichan button {
  border: 0;
  color: var(--primary);
  background: transparent;
  cursor: pointer;
}

.navichan button:hover,
.navichan button:focus-visible {
  color: var(--ink);
  background: var(--primary);
  outline: 0;
}

.navichan button:disabled {
  color: var(--dim);
  cursor: wait;
}

.navichan-compose {
  display: grid;
  gap: 8px;
  margin: 12px;
  padding: 10px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 91%, var(--primary));
}

.navichan-compose[hidden] {
  display: none;
}

.navichan-compose__fields,
.navichan-reply-form > div {
  display: grid;
  gap: 5px;
}

.navichan-compose__fields label,
.navichan-compose__message,
.navichan-reply-form label {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  color: var(--primary);
  font-size: 12px;
  letter-spacing: 0.06em;
}

.navichan-compose input,
.navichan-compose textarea,
.navichan-reply-form input,
.navichan-reply-form textarea {
  min-width: 0;
  padding: 5px 7px;
  border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
  color: var(--text);
  background: var(--bg);
  outline: 0;
}

.navichan-compose input:focus,
.navichan-compose textarea:focus,
.navichan-reply-form input:focus,
.navichan-reply-form textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 7px var(--shadow);
}

.navichan-compose textarea {
  min-height: 72px;
  resize: vertical;
}

.navichan-compose__message {
  align-items: start;
}

.navichan-compose__message > span {
  padding-top: 5px;
}

.navichan-compose__foot,
.navichan-reply-form footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.navichan-feed {
  display: grid;
  gap: 14px;
  padding: 0 12px 16px;
}

.navichan-state,
.navichan-setup {
  margin: 18px 0;
  padding: 16px;
  border: 1px dashed var(--border);
  text-align: center;
}

.navichan-state--error,
.navichan-setup strong {
  color: #d8a0a0;
}

.navichan-setup code {
  color: var(--primary);
}

.navichan-thread {
  border-top: 1px solid var(--primary);
  border-bottom: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
  background: color-mix(in srgb, var(--bg) 97%, var(--primary));
}

.navichan-post {
  padding: 8px 10px 10px;
}

.navichan-post--reply {
  width: calc(100% - 38px);
  margin: 5px 8px 5px 30px;
  border-left: 2px solid var(--border);
  background: color-mix(in srgb, var(--bg) 90%, var(--primary));
}

.navichan-post__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  color: var(--dim);
  font-size: 12px;
}

.navichan-post__meta strong {
  color: var(--primary);
}

.navichan-post__tag--operator {
  color: #c9a227;
}

.navichan-post__mod {
  color: #c9a227;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-shadow: 0 0 6px color-mix(in srgb, #c9a227 45%, transparent);
}

.navichan-post__subject {
  color: var(--primary);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
  overflow-wrap: anywhere;
}

.navichan-post__meta button {
  margin-left: auto;
  border-bottom: 1px dotted currentColor;
}

.navichan-post__content {
  display: flow-root;
  padding-top: 7px;
}

.navichan-post__content > p {
  min-height: 42px;
  margin: 0;
  padding: 5px 7px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.navichan-quote-link {
  color: var(--primary);
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  cursor: help;
}

.navichan-quote-link:hover,
.navichan-quote-link:focus-visible {
  color: var(--ink);
  background: var(--primary);
  outline: 0;
}

.navichan-quote-preview {
  position: fixed;
  z-index: 1000;
  max-height: 220px;
  padding: 8px 10px;
  overflow: hidden;
  border: 1px solid var(--primary);
  box-shadow: 5px 5px 0 color-mix(in srgb, var(--bg) 65%, transparent), 0 0 14px var(--shadow);
  color: var(--text);
  background: color-mix(in srgb, var(--bg) 94%, var(--primary));
  pointer-events: none;
}

.navichan-quote-preview[hidden] {
  display: none;
}

.navichan-quote-preview header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--border);
  color: var(--dim);
}

.navichan-quote-preview header strong,
.navichan-quote-preview h4 {
  color: var(--primary);
}

.navichan-quote-preview h4 {
  margin: 6px 0 0;
  font-size: 13px;
  font-weight: 400;
}

.navichan-quote-preview p {
  display: -webkit-box;
  margin: 6px 0 0;
  overflow: hidden;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
}

.navichan-post__image {
  float: left;
  width: min(190px, 35%);
  margin: 0 12px 6px 0;
}

.navichan-post__image button {
  display: block;
  width: 100%;
  padding: 0;
  border: 1px solid var(--border);
  background: #000;
}

.navichan-post__image img {
  display: block;
  width: 100%;
  max-height: 170px;
  object-fit: cover;
  filter: saturate(0.72) contrast(1.08);
}

.navichan-post__image button:hover img,
.navichan-post__image button:focus-visible img {
  filter: none;
}

.navichan-post__image figcaption {
  overflow: hidden;
  padding-top: 3px;
  color: var(--dim);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.navichan-reply-toggle {
  margin: 4px 9px 9px;
}

.navichan-reply-form {
  display: grid;
  gap: 7px;
  margin: 8px 10px 12px 30px;
  padding: 9px;
  border: 1px dashed var(--border);
}

.navichan-reply-form[hidden] {
  display: none;
}

.navichan-reply-form textarea {
  min-height: 54px;
  resize: vertical;
}

.image-viewer-window {
  width: min(var(--image-window-width), calc(100vw - 36px));
  min-width: 0;
  max-width: calc(100vw - 12px);
  height: min(var(--navichan-height), calc(100svh - 54px));
  max-height: calc(100svh - 54px);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 30px auto minmax(0, 1fr) 29px;
}

.image-viewer-window .window-body {
  min-height: 0;
  min-width: 0;
  max-height: none;
  overflow: hidden;
  position: relative;
  padding: 0;
  background: #000;
}

.image-viewer-window .window-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.image-viewer-actions {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 5px;
}

.image-viewer-download {
  min-width: 78px;
  height: 20px;
  padding: 0 5px;
  border: 1px solid var(--ink);
  color: var(--primary);
  background: var(--ink);
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}

.image-viewer-download:hover,
.image-viewer-download:focus-visible {
  color: var(--ink);
  background: var(--primary);
  outline: 1px solid var(--ink);
}

.image-viewer-download:disabled {
  color: var(--dim);
  cursor: wait;
}

.image-viewer-canvas {
  position: absolute;
  inset: 0;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  place-items: center;
  overflow: hidden;
  touch-action: none;
  overscroll-behavior: contain;
}

.image-viewer-canvas img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  user-select: none;
  transform-origin: center;
  will-change: transform;
}

.window-footer {
  min-height: 29px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 12px;
  border-top: 1px solid var(--border);
  color: var(--dim);
  font-size: 12px;
  letter-spacing: 0.1em;
}

.window-footer__status {
  min-width: 0;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.window-footer__status::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  width: 5px;
  height: 5px;
  margin: -1px 7px 0 0;
  background: var(--primary);
  box-shadow: 0 0 5px var(--glow);
  animation: footer-signal 2.4s steps(1, end) infinite;
}

@keyframes footer-signal {
  0%, 58% { opacity: 1; }
  59%, 100% { opacity: 0.22; }
}

.command-rail {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 8;
  min-height: 34px;
  display: flex;
  align-items: center;
  gap: 0;
  padding: 0 12px;
  border-top: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
  color: var(--dim);
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  font-size: 12px;
  letter-spacing: 0.08em;
}

.terminal-player {
  width: min(520px, 100%);
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
}

.master-volume {
  position: relative;
  z-index: 2;
  display: grid;
  flex: 0 0 18px;
  place-items: center;
}

.master-volume__button {
  width: 18px;
  height: 24px;
  display: grid;
  padding: 0;
  border: 0;
  color: var(--dim);
  background: transparent;
  cursor: pointer;
  place-items: center;
}

.master-volume__button:hover,
.master-volume__button:focus-visible,
.master-volume:focus-within .master-volume__button {
  color: #f2f5f7;
  outline: 0;
  filter: drop-shadow(0 0 4px rgba(242, 245, 247, 0.48));
}

.master-volume__icon {
  width: 16px;
  height: 16px;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-linecap: square;
  stroke-linejoin: miter;
  stroke-width: 1.2;
}

.master-volume__speaker {
  fill: currentColor;
  stroke: none;
}

.master-volume__mute {
  display: none;
}

.master-volume__button.is-muted .master-volume__wave {
  display: none;
}

.master-volume__button.is-muted .master-volume__mute {
  display: block;
}

.master-volume__popover {
  position: absolute;
  bottom: calc(100% - 1px);
  left: 50%;
  width: 31px;
  height: 86px;
  display: block;
  padding: 5px 3px 6px;
  border: 1px solid color-mix(in srgb, var(--primary) 68%, var(--border));
  background: color-mix(in srgb, var(--bg) 97%, #000);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.72), inset 0 0 9px color-mix(in srgb, var(--primary) 7%, transparent);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 4px);
  transition: opacity 75ms linear, transform 90ms steps(3, end), visibility 0s linear 90ms;
  visibility: hidden;
}

.master-volume:hover .master-volume__popover,
.master-volume:focus-within .master-volume__popover,
.master-volume.is-open .master-volume__popover {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, 0);
  transition-delay: 0s;
  visibility: visible;
}

.master-volume__readout {
  position: absolute;
  top: 4px;
  left: 0;
  width: 100%;
  color: var(--primary);
  font: 7px/10px var(--font);
  letter-spacing: 0.05em;
  text-align: center;
  text-shadow: 0 0 5px var(--glow);
}

.master-volume__slider {
  --volume-level: 100%;
  position: absolute;
  top: 19px;
  left: 50%;
  width: 24px;
  height: 61px;
  margin: 0;
  appearance: none;
  background: transparent;
  cursor: ns-resize;
  direction: rtl;
  transform: translateX(-50%);
  writing-mode: vertical-lr;
}

.master-volume__slider:focus {
  outline: 0;
}

.master-volume__slider::-webkit-slider-runnable-track {
  width: 4px;
  height: 100%;
  border: 1px solid color-mix(in srgb, var(--border) 62%, transparent);
  background: linear-gradient(0deg,
    var(--primary) 0 var(--volume-level),
    color-mix(in srgb, var(--border) 20%, #020609) var(--volume-level) 100%);
  box-shadow: 0 0 4px color-mix(in srgb, var(--primary) 18%, transparent);
}

.master-volume__slider::-webkit-slider-thumb {
  width: 12px;
  height: 7px;
  margin-left: -5px;
  appearance: none;
  border: 1px solid #f2f5f7;
  border-radius: 0;
  background: var(--bg);
  box-shadow: 0 0 5px rgba(242, 245, 247, 0.5);
}

.master-volume__slider::-moz-range-track {
  width: 4px;
  height: 100%;
  border: 1px solid color-mix(in srgb, var(--border) 62%, transparent);
  border-radius: 0;
  background: linear-gradient(0deg,
    var(--primary) 0 var(--volume-level),
    color-mix(in srgb, var(--border) 20%, #020609) var(--volume-level) 100%);
  box-shadow: 0 0 4px color-mix(in srgb, var(--primary) 18%, transparent);
}

.master-volume__slider::-moz-range-thumb {
  width: 12px;
  height: 7px;
  border: 1px solid #f2f5f7;
  border-radius: 0;
  background: var(--bg);
  box-shadow: 0 0 5px rgba(242, 245, 247, 0.5);
}

.player-track {
  overflow: hidden;
  color: var(--dim);
  text-overflow: ellipsis;
}

.contact-window {
  width: min(700px, calc(100vw - 36px));
}

.profile-window {
  width: min(660px, calc(100vw - 36px));
}

.notes-window {
  width: min(840px, calc(100vw - 36px));
  height: min(620px, calc(100svh - 54px));
  max-height: calc(100svh - 54px);
  display: grid;
  grid-template-rows: 30px auto minmax(0, 1fr) 29px;
}

.notes-window .window-body {
  min-height: 0;
  height: 100%;
  max-height: none;
  padding: 0;
  overflow: hidden;
}

.navi-notes {
  height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  background: color-mix(in srgb, var(--bg) 97%, var(--primary));
}

.navi-notes button,
.navi-notes input,
.navi-notes textarea {
  border-radius: 0;
  font: inherit;
}

.navi-notes button {
  border: 0;
  color: var(--primary);
  background: transparent;
  cursor: pointer;
}

.navi-notes button:hover,
.navi-notes button:focus-visible {
  color: var(--ink);
  background: var(--primary);
  outline: 0;
}

.navi-notes__toolbar {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 88%, var(--primary));
}

.navi-notes__toolbar label {
  min-width: 0;
  flex: 1;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  color: var(--dim);
  font-size: 12px;
  letter-spacing: .08em;
}

.navi-notes__toolbar input,
.navi-notes__title,
.navi-notes__body {
  min-width: 0;
  border: 1px solid var(--border);
  color: var(--text);
  background: var(--bg);
  outline: 0;
}

.navi-notes__toolbar input {
  height: 28px;
  padding: 3px 7px;
}

.navi-notes__toolbar input:focus,
.navi-notes__title:focus,
.navi-notes__body:focus {
  border-color: var(--primary);
}

.navi-notes__toolbar > div {
  display: flex;
  gap: 3px;
}

.navi-notes__toolbar button {
  min-height: 28px;
  padding: 2px 6px;
}

.navi-notes__file {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.navi-notes__workspace {
  min-height: 0;
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
}

.navi-notes__index {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  border-right: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 92%, var(--primary));
}

.navi-notes__index-head {
  display: flex;
  justify-content: space-between;
  padding: 6px 9px;
  border-bottom: 1px solid var(--border);
  color: var(--dim);
  font-size: 11px;
  letter-spacing: .1em;
}

.navi-notes__index-head b {
  color: var(--primary);
}

.navi-notes__list {
  min-height: 0;
  overflow: auto;
  scrollbar-color: var(--border) var(--bg);
  scrollbar-width: thin;
}

.navi-notes__list button {
  width: 100%;
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border-bottom: 1px dotted var(--border);
  text-align: left;
}

.navi-notes__list button strong {
  overflow: hidden;
  color: #aeb8be;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.navi-notes__list button span {
  color: var(--dim);
  font-size: 10px;
  letter-spacing: .06em;
}

.navi-notes__list button:hover strong,
.navi-notes__list button:focus-visible strong,
.navi-notes__list button.is-active strong,
.navi-notes__list button:hover span,
.navi-notes__list button:focus-visible span,
.navi-notes__list button.is-active span {
  color: var(--ink);
}

.navi-notes__list button.is-active {
  color: var(--ink);
  background: var(--primary);
}

.navi-notes__no-results {
  margin: 0!important;
  padding: 14px 10px;
  color: var(--dim);
  font-size: 11px;
  letter-spacing: .08em;
}

.navi-notes__editor {
  min-width: 0;
  min-height: 0;
  position: relative;
}

.navi-notes__empty {
  height: 100%;
  display: grid;
  place-content: center;
  gap: 5px;
  color: var(--dim);
  text-align: center;
  letter-spacing: .08em;
}

.navi-notes__empty[hidden],
.navi-notes__document[hidden] {
  display: none;
}

.navi-notes__empty strong {
  color: var(--primary);
  font-size: 18px;
}

.navi-notes__empty span {
  font-size: 11px;
}

.navi-notes__document {
  height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}

.navi-notes__title {
  width: 100%;
  padding: 10px 12px 8px;
  border-width: 0 0 3px;
  color: var(--primary);
  font-size: 23px;
  letter-spacing: .04em;
}

.navi-notes__body {
  width: 100%;
  min-height: 0;
  resize: none;
  padding: 14px;
  border-width: 0 0 1px;
  color: #aeb8be;
  font-size: 16px;
  line-height: 1.45;
}

.navi-notes__document footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
  min-height: 31px;
  padding: 3px 7px 3px 10px;
  color: var(--dim);
  font-size: 10px;
  letter-spacing: .07em;
}

.navi-notes__document footer button {
  color: #b98787;
}

.apps-window {
  width: min(620px, calc(100vw - 36px));
}

.app-folder {
  min-height: 270px;
  border: 1px solid var(--border);
  background: #03070a;
}

.app-folder > header,
.app-folder__item {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 110px;
  align-items: center;
}

.app-folder > header {
  min-height: 27px;
  padding: 0 9px;
  border-bottom: 1px solid var(--border);
  color: var(--dim);
  font-size: 10px;
  letter-spacing: .1em;
}

.app-folder > header span:first-child {
  grid-column: 2;
}

.app-folder__list {
  display: grid;
}

.app-folder__item {
  width: 100%;
  min-height: 58px;
  padding: 5px 9px;
  border: 0;
  border-bottom: 1px dotted var(--border);
  color: var(--text);
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.app-folder__item:hover,
.app-folder__item:focus-visible {
  color: var(--ink);
  background: var(--primary);
  outline: 0;
}

.app-folder__item i {
  width: 32px;
  height: 32px;
  background: currentColor;
  -webkit-mask: var(--folder-item-icon) center / contain no-repeat;
  mask: var(--folder-item-icon) center / contain no-repeat;
}

.app-folder__item[data-open-applet="contact"] { --folder-item-icon: url("assets/pixelarticons/mail.svg"); }
.app-folder__item[data-open-applet="notes"] { --folder-item-icon: url("assets/pixelarticons/notebook.svg"); }
.app-folder__item[data-open-applet="scanner"] { --folder-item-icon: url("assets/pixelarticons/radio.svg"); }
.app-folder__item[data-open-applet="files"] { --folder-item-icon: url("assets/pixelarticons/folder.svg"); }
.app-folder__item[data-open-applet="terminal"] { --folder-item-icon: url("assets/pixelarticons/terminal-sharp.svg"); }

.mail-window {
  width: min(880px, calc(100vw - 36px));
  height: min(620px, calc(100svh - 54px));
  max-height: calc(100svh - 54px);
  display: grid;
  grid-template-rows: 30px auto minmax(0, 1fr) 29px;
}

.mail-window .window-body {
  min-height: 0;
  max-height: none;
  padding: 0;
}

.navi-mail {
  height: 100%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  background: var(--bg);
}

.navi-mail__menubar {
  display: flex;
  gap: 15px;
  padding: 5px 10px;
  border-bottom: 1px solid var(--primary);
  color: var(--text);
  font-size: 12px;
  letter-spacing: 0.1em;
}

.navi-mail__layout {
  display: grid;
  grid-template-columns: minmax(0, 236px) minmax(0, 1fr);
  min-height: 0;
}

.navi-mail__list {
  min-height: 0;
  overflow: auto;
  padding: 4px 0;
  border-right: 1px solid var(--primary);
}

.navi-mail__item {
  display: block;
  width: 100%;
  padding: 9px 12px;
  border: 0;
  border-bottom: 1px dotted color-mix(in srgb, var(--border) 70%, transparent);
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 16px;
  text-align: left;
  cursor: pointer;
}

.navi-mail__item-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.navi-mail__item strong {
  overflow: hidden;
  color: var(--text);
  font-weight: 400;
  letter-spacing: 0.04em;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.navi-mail__item time {
  flex: 0 0 auto;
  color: var(--dim);
  font-size: 12px;
  letter-spacing: 0.1em;
}

.navi-mail__item.is-active {
  background: color-mix(in srgb, var(--primary) 13%, transparent);
  box-shadow: inset 2px 0 0 var(--primary);
}

.navi-mail__item.is-active strong {
  color: var(--primary);
}

.navi-mail__item:hover,
.navi-mail__item:focus-visible {
  background: var(--primary);
  outline: 0;
}

.navi-mail__item:hover strong,
.navi-mail__item:hover time,
.navi-mail__item:focus-visible strong,
.navi-mail__item:focus-visible time {
  color: var(--ink);
}

.navi-mail__reader {
  min-height: 0;
  overflow: auto;
  padding: 18px 20px 22px;
  line-height: 1.6;
}

.navi-mail__reader header {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}

.navi-mail__reader h2 {
  margin: 0 0 12px;
  color: var(--primary);
  font-size: 19px;
  letter-spacing: 0.05em;
}

.navi-mail__reader dl {
  display: grid;
  gap: 4px;
  margin: 0;
}

.navi-mail__reader dl > div {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 10px;
}

.navi-mail__reader dt {
  color: var(--dim);
  font-size: 11px;
  letter-spacing: 0.12em;
}

.navi-mail__reader dd {
  margin: 0;
  color: var(--text);
  font-size: 14px;
  overflow-wrap: anywhere;
}

.navi-mail__message {
  padding-top: 16px;
}

.navi-mail__message p {
  margin: 0 0 14px;
}

.navi-mail__empty {
  margin: 0;
  padding: 14px 12px;
  color: var(--dim);
  font-size: 13px;
  letter-spacing: 0.12em;
}

@media (max-width: 720px), (pointer: coarse) {
  .navi-mail__layout {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
  }

  .navi-mail__list {
    border-right: 0;
  }
}

@media (min-width: 721px) and (pointer: fine) {
  .navi-mail__list[hidden],
  .navi-mail__reader[hidden] {
    display: block;
  }
}

.files-window {
  width: min(720px, calc(100vw - 36px));
}

.files-browser {
  min-height: 340px;
  border: 1px solid var(--border);
  background: #03070a;
}

.files-browser__toolbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  min-height: 32px;
  border-bottom: 1px solid var(--border);
}

.files-browser__toolbar button {
  border: 0;
  border-right: 1px solid var(--border);
  color: var(--text);
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.files-browser__toolbar button:disabled {
  color: var(--dim);
  cursor: default;
}

.files-browser__toolbar button:not(:disabled):hover,
.files-browser__toolbar button:not(:disabled):focus-visible {
  color: var(--ink);
  background: var(--primary);
  outline: 0;
}

.files-browser__toolbar span {
  overflow: hidden;
  padding: 6px 10px;
  color: #aeb8be;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.files-browser__columns,
.files-browser__item {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 110px 60px;
  align-items: center;
}

.files-browser__columns {
  min-height: 25px;
  padding: 0 9px;
  border-bottom: 1px solid var(--border);
  color: var(--dim);
  font-size: 10px;
  letter-spacing: .09em;
}

.files-browser__columns span:first-child { grid-column: 2; }

.files-browser__item {
  width: 100%;
  min-height: 43px;
  padding: 3px 9px;
  border: 0;
  border-bottom: 1px dotted var(--border);
  color: var(--text);
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.files-browser__item:hover,
.files-browser__item:focus-visible {
  color: var(--ink);
  background: var(--primary);
  outline: 0;
}

.files-browser__item i {
  width: 25px;
  height: 25px;
  background: currentColor;
  -webkit-mask: var(--file-icon) center / contain no-repeat;
  mask: var(--file-icon) center / contain no-repeat;
}

.files-browser__item[data-file-kind="folder"] { --file-icon: url("assets/pixelarticons/folder.svg"); }
.files-browser__item[data-file-kind="text"] { --file-icon: url("assets/pixelarticons/notebook.svg"); }
.files-browser__item[data-file-kind="config"],
.files-browser__item[data-file-kind="system"] { --file-icon: url("assets/pixelarticons/terminal.svg"); }

.files-browser__item strong {
  overflow: hidden;
  font-size: 16px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.files-browser__item small,
.files-browser__item span {
  color: var(--dim);
  font-size: 10px;
  letter-spacing: .06em;
}

.files-browser__item:hover small,
.files-browser__item:hover span,
.files-browser__item:focus-visible small,
.files-browser__item:focus-visible span { color: var(--ink); }

.files-browser__empty {
  margin: 0;
  padding: 18px 10px;
  color: var(--dim);
}

.notepad-window {
  width: min(660px, calc(100vw - 36px));
}

.notepad-window .window-body {
  padding: 0;
}

.mock-notepad {
  display: grid;
  grid-template-rows: 28px minmax(260px, 1fr) 24px;
  min-height: 360px;
  background: #05090c;
}

.mock-notepad__menu {
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 0 10px;
  border-bottom: 1px solid var(--border);
  color: #aeb8be;
  font-size: 13px;
  letter-spacing: .04em;
}

.mock-notepad__menu span::first-letter {
  text-decoration: underline;
}

.mock-notepad__editor {
  width: 100%;
  min-height: 0;
  resize: none;
  padding: 14px 16px;
  border: 0;
  border-radius: 0;
  outline: 0;
  color: #bac3c8;
  background: #05090c;
  font: 18px/1.45 "VT323", "Lucida Console", "Courier New", monospace;
  caret-color: var(--primary);
  white-space: pre-wrap;
}

.mock-notepad__editor:focus {
  box-shadow: inset 0 0 0 1px var(--dim);
}

.mock-notepad__status {
  display: flex;
  justify-content: flex-end;
  border-top: 1px solid var(--border);
  color: var(--dim);
  font-size: 11px;
}

.mock-notepad__status span {
  min-width: 72px;
  padding: 3px 8px;
  border-left: 1px solid var(--border);
  text-align: right;
}

.app-folder__item strong {
  overflow: hidden;
  color: #aeb8be;
  font-size: 17px;
  font-weight: 400;
  letter-spacing: .04em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-folder__item small {
  color: var(--dim);
  font-size: 10px;
  letter-spacing: .08em;
}

.app-folder__item:hover strong,
.app-folder__item:hover small,
.app-folder__item:focus-visible strong,
.app-folder__item:focus-visible small {
  color: var(--ink);
}

.scanner-window {
  width: min(690px, calc(100vw - 36px));
}

.signal-scanner {
  display: grid;
  gap: 14px;
}

.signal-scanner > header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 7px;
  border-bottom: 1px solid var(--border);
  color: var(--dim);
  font-size: 11px;
  letter-spacing: .1em;
}

.signal-scanner > header span {
  color: #aeb8be;
}

.signal-scanner > header b {
  color: var(--primary);
  font-weight: 400;
}

.signal-scanner__field {
  position: relative;
  height: 150px;
  overflow: hidden;
  border: 1px solid var(--border);
  background:
    repeating-linear-gradient(180deg, transparent 0 24px, color-mix(in srgb, var(--border) 42%, transparent) 24px 25px),
    #03070a;
}

.signal-scanner__field::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(90deg, transparent 0 79px, color-mix(in srgb, var(--border) 24%, transparent) 79px 80px);
}

.signal-scanner__field > i {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -3px;
  width: 3px;
  background: var(--primary);
  box-shadow: 5px 0 10px var(--glow);
  animation: scanner-pass 3.2s steps(32, end) infinite;
}

.signal-scanner__field span {
  position: absolute;
  left: 8%;
  width: 2px;
  height: 2px;
  background: var(--dim);
  box-shadow: 58px 0 0 var(--dim), 137px 0 0 var(--dim), 223px 0 0 var(--dim), 311px 0 0 var(--dim), 418px 0 0 var(--dim);
}

.signal-scanner__field span:nth-of-type(1) { top: 24px; }
.signal-scanner__field span:nth-of-type(2) { top: 49px; left: 18%; opacity: .5; }
.signal-scanner__field span:nth-of-type(3) { top: 74px; left: 3%; }
.signal-scanner__field span:nth-of-type(4) { top: 99px; left: 25%; opacity: .55; }
.signal-scanner__field span:nth-of-type(5) { top: 124px; left: 12%; }

.signal-scanner__state {
  display: grid;
  grid-template-columns: minmax(230px, 1.15fr) minmax(250px, 1fr);
  gap: 14px;
}

.signal-scanner__state > strong {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--primary);
  color: var(--primary);
  font-size: 22px;
  font-weight: 400;
  letter-spacing: .08em;
}

.signal-scanner__state > strong i {
  width: 6px;
  height: 6px;
  background: var(--primary);
  animation: scanner-blink 1s steps(1, end) infinite;
}

.signal-scanner__state output {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--border);
  color: #aeb8be;
  background: #03070a;
  font: inherit;
  font-size: 20px;
  letter-spacing: .06em;
  white-space: nowrap;
}

@keyframes scanner-pass {
  from { left: -3px; }
  to { left: calc(100% + 3px); }
}

@keyframes scanner-blink {
  0%, 48% { opacity: 1; }
  49%, 100% { opacity: .2; }
}
.operator-profile {
  display: grid;
  gap: 16px;
}

.operator-profile > header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 12px;
  border-bottom: 3px double var(--border);
}

.operator-profile > header span,
.operator-profile__panel h2 {
  color: var(--dim);
  font-size: 11px;
  letter-spacing: 0.14em;
}

.operator-profile > header strong {
  color: var(--primary);
  font-size: 23px;
  letter-spacing: 0.08em;
}

.operator-profile__panel {
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg) 90%, var(--primary));
}

.operator-profile__panel h2 {
  margin: 0;
  padding: 6px 9px;
  color: var(--bg);
  background: var(--primary);
}

.operator-profile__counts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 0;
}

.operator-profile__counts div {
  padding: 13px 10px;
  border-right: 1px solid var(--border);
}

.operator-profile__counts div:last-child {
  border-right: 0;
}

.operator-profile__counts dt {
  color: var(--dim);
  font-size: 10px;
}

.operator-profile__counts dd {
  margin: 5px 0 0;
  color: var(--primary);
  font-size: 25px;
}

.operator-profile__relay {
  margin: 0!important;
  padding: 5px 9px;
  border-top: 1px dotted var(--border);
  color: var(--dim);
  font-size: 9px;
  letter-spacing: 0.1em;
}

.operator-profile__networks {
  min-height: 62px;
  padding: 9px;
}

.operator-profile__networks > p {
  margin: 14px 0!important;
  color: var(--dim);
  text-align: center;
}

.operator-profile__networks table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.operator-profile__networks th,
.operator-profile__networks td {
  padding: 7px 8px;
  border-bottom: 1px dotted var(--border);
}

.operator-profile__networks th {
  color: var(--dim);
  font-size: 9px;
  letter-spacing: 0.1em;
}

.operator-profile__networks td:first-child {
  color: var(--primary);
}

.contact-profile {
  display: grid;
  grid-template-columns: 168px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}

.contact-profile__portrait {
  margin: 0;
}

.contact-profile__portrait img {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
  filter: invert(1) brightness(0.82) sepia(0.15) saturate(1.3) hue-rotate(165deg);
  mix-blend-mode: screen;
}

.contact-profile__identity h2 {
  margin: 0 0 8px;
  color: var(--primary);
  font-size: 28px;
  letter-spacing: 0.08em;
}

.contact-profile__identity li {
  grid-template-columns: 112px minmax(0, 1fr);
}

.contact-operator-id {
  color: #c9a227;
  letter-spacing: 0.08em;
}

.contact-email {
  color: #aeb8be;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.contact-note {
  margin: 16px 0 0;
  color: var(--text);
}

.contact-email:hover,
.contact-email:focus-visible {
  color: var(--primary);
  outline: 0;
}

.player-progress {
  width: 112px;
  height: 5px;
  border: 0;
  border-radius: 0;
  color: #f2f5f7;
  background: color-mix(in srgb, var(--border) 32%, transparent);
}

.player-progress::-webkit-progress-bar {
  background: color-mix(in srgb, var(--border) 32%, transparent);
}

.player-progress::-webkit-progress-value {
  background: #f2f5f7;
  box-shadow: 0 0 5px rgba(242, 245, 247, 0.42);
}

.player-progress::-moz-progress-bar {
  background: #f2f5f7;
  box-shadow: 0 0 5px rgba(242, 245, 247, 0.42);
}

.noscript {
  position: fixed;
  top: 10px;
  left: 50%;
  z-index: 50;
  transform: translateX(-50%);
  color: var(--ink);
  background: var(--primary);
  padding: 5px 9px;
}

.is-launching {
  animation: launcher-pulse 180ms steps(3, end);
}

.ready .launcher.is-launching {
  animation: launcher-pulse 180ms steps(3, end) both;
}

.booting .launcher {
  opacity: 0;
}

.ready .launcher {
  animation: resolve-in 520ms steps(7, end) both;
}

.ready .signal-field { animation: screen-field-in 720ms steps(8, end) both; }
.ready .signal-field.is-ambient-flickering { animation: ambient-screen-flicker 720ms steps(8, end) both; }
.ready .dock-channel { animation: dock-channel-in 540ms steps(6, end) 160ms both; }
.ready .navi-identity {
  opacity: 1;
  animation: none;
}
.ready .launcher:nth-child(1) { animation-delay: 430ms; }
.ready .launcher:nth-child(2) { animation-delay: 500ms; }
.ready .launcher:nth-child(3) { animation-delay: 570ms; }
.ready .launcher:nth-child(4) { animation-delay: 640ms; }
.ready .launcher:nth-child(5) { animation-delay: 710ms; }
.ready .launcher:nth-child(6) { animation-delay: 780ms; }
.ready .command-rail { animation: rail-in 420ms steps(5, end) 900ms both; }

@keyframes resolve-in {
  0% { opacity: 0; transform: translateY(8px) scaleY(0.15); filter: brightness(3); clip-path: inset(46% 0); }
  45% { opacity: 1; transform: translateY(2px) scaleY(1); filter: brightness(2); clip-path: inset(0); }
  100% { opacity: 1; transform: translateY(0); filter: none; clip-path: inset(0); }
}

@keyframes screen-field-in {
  0% { opacity: 0; filter: brightness(4); }
  22% { opacity: 1; filter: brightness(2.2); }
  48% { opacity: 0.45; filter: brightness(0.65); }
  100% { opacity: 1; filter: brightness(1); }
}

@keyframes ambient-screen-flicker {
  0% { opacity: 1; filter: brightness(1); }
  10% { opacity: 0.08; filter: brightness(3.4); }
  24% { opacity: 1; filter: brightness(2.2); }
  43% { opacity: 0.42; filter: brightness(0.7); }
  62% { opacity: 0.92; filter: brightness(1.55); }
  100% { opacity: 1; filter: brightness(1); }
}

@keyframes rail-in {
  from { opacity: 0; transform: translateY(100%); filter: brightness(2); }
  to { opacity: 1; transform: translateY(0); filter: none; }
}

@keyframes dock-channel-in {
  from { opacity: 0; transform: translateX(-100%); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes navi-identity-in {
  0% { opacity: 0; transform: translateY(-8px); filter: brightness(3); }
  45% { opacity: 1; transform: translateY(1px); filter: brightness(1.8); }
  100% { opacity: 1; transform: translateY(0); filter: none; }
}

@keyframes navi-logo-float {
  0% { transform: translate(0, 0) scale(1); filter: brightness(1); }
  28% { transform: translate(3px, -5px) scale(1.015); filter: brightness(1.08); }
  56% { transform: translate(-2px, -1px) scale(0.995); filter: brightness(0.96); }
  78% { transform: translate(2px, -8px) scale(1.025); filter: brightness(1.12); }
  100% { transform: translate(-1px, -4px) scale(1.01); filter: brightness(1.02); }
}

@keyframes navi-logo-turntable {
  0% { transform: perspective(360px) rotateY(0deg) scale(1); }
  40% { transform: perspective(360px) rotateY(600deg) scale(1); }
  68% { transform: perspective(360px) rotateY(900deg) scale(1); }
  86% { transform: perspective(360px) rotateY(1030deg) scale(1); }
  96% { transform: perspective(360px) rotateY(1072deg) scale(1); }
  100% { transform: perspective(360px) rotateY(1080deg) scale(1); }
}

@keyframes window-resolve {
  0% { opacity: 0; transform: translate(-50%, -50%) scaleX(0.04) scaleY(0.025); filter: brightness(2.4); }
  34% { opacity: 1; transform: translate(-50%, -50%) scaleX(1) scaleY(0.045); filter: brightness(1.8); }
  100% { opacity: 1; transform: translate(-50%, -50%) scale(1); filter: none; }
}

@keyframes window-dismiss {
  0% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  46% { opacity: 1; transform: translate(-50%, -50%) scaleX(1) scaleY(0.08); filter: brightness(1.6); }
  78% { opacity: 1; transform: translate(-50%, -50%) scaleX(0.18) scaleY(0.035); filter: brightness(2.2); }
  100% { opacity: 0; transform: translate(-50%, -50%) scaleX(0) scaleY(0.02); filter: brightness(0); }
}

@keyframes launcher-pulse {
  0%, 100% { filter: none; }
  50% { filter: brightness(2); }
}

@keyframes signal-drift {
  from { opacity: 0.12; transform: translateX(0); }
  to { opacity: 0.28; transform: translateX(4px); }
}

@keyframes phosphor-drift {
  from { background-position: 0 -220px; }
  to { background-position: 0 calc(100vh + 220px); }
}

@media (max-width: 720px) {
  .boot-prompt__desktop {
    display: none;
  }

  .boot-prompt__mobile {
    display: inline;
  }

  .desktop {
    padding-inline: 13px 16px;
  }

  .system-shell {
    left: 91px;
    width: 156px;
  }

  .launcher-grid {
    grid-template-columns: 156px;
    grid-auto-rows: 92px;
    gap: 2px;
  }

  .launcher {
    width: 156px;
    height: 92px;
  }

  .dock-channel {
    width: 182px;
  }

  .command-rail {
    display: flex;
  }
}

@media (max-width: 560px) {
  .contact-profile {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 11px;
  }

  .contact-profile__identity h2 {
    font-size: 21px;
  }

}

@media (max-width: 430px) {
  .os-handoff-mark {
    width: 240px;
    height: 240px;
  }

  .background-art {
    object-position: 82% center;
  }

  .boot-screen {
    padding: 12px 10px 64px;
    font-size: 16px;
    line-height: 1;
  }

  .boot-header {
    gap: 9px;
  }

  .boot-version {
    margin-top: 18px;
  }

  .boot-log {
    width: 100%;
    margin-top: 16px;
  }

  .boot-line {
    grid-template-columns: minmax(20ch, 1fr) auto;
    gap: 0.5ch;
  }

  .boot-line__label::after {
    content: " .";
  }

  .boot-line.is-axiom {
    padding-left: 8px;
  }

  .boot-footer {
    right: 10px;
    bottom: 10px;
    left: 10px;
  }

  .boot-footer span {
    display: none;
  }

  .desktop {
    place-items: center;
    padding: 30px 12px 78px;
  }

  .system-shell {
    position: relative;
    top: auto;
    left: auto;
    width: min-content;
    transform: none;
  }

  .navi-identity {
    top: -15px;
    height: 126px;
    margin-bottom: 5px;
  }

  .navi-logo-model {
    width: 120px;
    height: 120px;
  }

  .dock-channel {
    display: none;
  }

  .launcher-grid {
    top: 0;
    grid-template-columns: repeat(2, 104px);
    grid-auto-rows: 96px;
    gap: 8px;
  }

  .launcher {
    flex-direction: column;
    justify-content: center;
    gap: 9px;
    width: 104px;
    height: 96px;
    padding: 10px;
  }

  .folder-icon {
    width: 46px;
    height: 52px;
    flex-basis: 52px;
  }

  .launcher[data-folder="contact"] .folder-icon,
  .launcher[data-folder="contact"] .launcher-label {
    color: #071018;
  }

  .window-open .launcher[data-folder="contact"].is-selected .folder-icon,
  .launcher[data-folder="contact"]:hover .folder-icon,
  .launcher[data-folder="contact"]:focus-visible .folder-icon,
  .window-open .launcher[data-folder="contact"].is-selected .launcher-label,
  .launcher[data-folder="contact"]:hover .launcher-label,
  .launcher[data-folder="contact"]:focus-visible .launcher-label {
    color: var(--primary);
  }

  .command-rail {
    min-height: 34px;
    padding: 0 8px;
  }

  .terminal-player {
    display: flex;
    gap: 7px;
    font-size: 8px;
  }

  .player-progress {
    width: 68px;
  }

  .window-body {
    padding: 15px;
  }

  .window-body li {
    grid-template-columns: 72px 1fr;
    gap: 10px;
  }

  .profile-window {
    width: calc(100vw - 12px);
  }

  .operator-profile > header {
    align-items: start;
    flex-direction: column;
    gap: 5px;
  }

  .operator-profile__counts {
    grid-template-columns: 1fr;
  }

  .operator-profile__counts div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 10px;
    border-right: 0;
    border-bottom: 1px dotted var(--border);
  }

  .operator-profile__counts dd {
    margin: 0;
    font-size: 18px;
  }

  .news-window,
  .navigator-window,
  .navichan-window,
  .notes-window,
  .image-viewer-window,
  .notepad-window,
  .files-window,
  .apps-window,
  .scanner-window {
    width: calc(100vw - 12px);
    height: calc(100svh - 42px);
    max-height: calc(100svh - 42px);
  }

  .news-window .window-body,
  .navigator-window .window-body,
  .navichan-window .window-body,
  .notes-window .window-body,
  .image-viewer-window .window-body,
  .notepad-window .window-body,
  .files-window .window-body,
  .apps-window .window-body,
  .scanner-window .window-body {
    padding: 0;
  }

  .notepad-window,
  .files-window,
  .apps-window,
  .scanner-window {
    display: grid;
    grid-template-rows: 30px auto minmax(0, 1fr) 29px;
  }

  .notepad-window .window-body,
  .files-window .window-body,
  .apps-window .window-body,
  .scanner-window .window-body {
    min-height: 0;
    height: 100%;
    max-height: none;
    overflow: auto;
  }

  .app-folder {
    min-height: 100%;
    border: 0;
  }

  .files-browser {
    min-height: 100%;
    border: 0;
  }

  .files-browser__columns,
  .files-browser__item {
    grid-template-columns: 34px minmax(0, 1fr) 76px 44px;
  }

  .mock-notepad {
    min-height: 100%;
    height: 100%;
  }

  .mock-notepad__menu {
    gap: 15px;
  }

  .signal-scanner {
    padding: 10px;
  }

  .signal-scanner__state {
    grid-template-columns: 1fr;
  }
  .navi-notes__toolbar {
    display: grid;
    grid-template-columns: 1fr;
    gap: 5px;
    padding: 6px 7px;
  }

  .navi-notes__toolbar > div {
    justify-content: space-between;
  }

  .navi-notes__toolbar button {
    flex: 1;
  }

  .navi-notes__workspace {
    grid-template-columns: 1fr;
    grid-template-rows: 126px minmax(0, 1fr);
  }

  .navi-notes__index {
    grid-template-rows: auto minmax(0, 1fr);
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }

  .navi-notes__list {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
  }

  .navi-notes__list button {
    width: 154px;
    min-width: 154px;
    border-right: 1px dotted var(--border);
    border-bottom: 0;
  }

  .navi-notes__no-results {
    min-width: 100%;
  }

  .navi-notes__title {
    padding: 8px 9px 6px;
    font-size: 20px;
  }

  .navi-notes__body {
    padding: 10px;
    font-size: 15px;
  }

  .navi-notes__document footer {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px;
  }

  .navi-notes__document footer [data-notes-stats] {
    display: none;
  }

  .navi-news__masthead {
    min-height: 84px;
    padding: 11px 10px;
  }

  .navigator-masthead { min-height: 72px; padding: 9px 10px; }
  .navigator-wordmark > b { width: 42px; height: 39px; font-size: 34px; box-shadow: 4px 4px 0 #17232c; }
  .navigator-wordmark strong { font-size: 25px; }.navigator-wordmark small { margin-top: 6px; font-size: 9px; }
  .navigator-status { display: none; }.navigator-tabs { width: 100%; min-width: 0; overflow-x: auto; }.navigator-tabs button { flex: 0 0 auto; }
  .navigator-layout { grid-template-columns: 1fr; }.navigator-layout aside { display: none; }
  .navigator-entry { grid-template-columns: 15px minmax(0, 1fr); }.navigator-entry time { display: none; }

  .navigator-v2 .navigator-tabs { overflow: hidden; }
  .navigator-v2 .navigator-tabs button { flex: 1 1 25%; min-width: 0; min-height: 38px; padding-inline: 3px; font-size: 11px; letter-spacing: 0; }
  .navigator-v2 .navigator-tabs button[data-navigator-view="NAVINET"]::after { font-size: 11px; }
  .navigator-browser-tab { width: 140px; max-width: 140px; }
  .navigator-browser-toolbar { grid-template-columns: 30px 30px minmax(80px, 1fr) 31px 35px 35px; }
  .navigator-browser-toolbar > button[data-navigator-library] { padding: 0; overflow: hidden; font-size: 0; }
  .navigator-browser-toolbar > button[data-navigator-library="BOOKMARKS"]::after { content: "BM"; font-size: 11px; }
  .navigator-browser-toolbar > button[data-navigator-library="HISTORY"]::after { content: "HI"; font-size: 11px; }
  .navigator-library { padding: 10px; }
  .navigator-library li { grid-template-columns: minmax(0, 1fr) auto; gap: 6px; }
  .navigator-library li > small { grid-column: 1 / -1; grid-row: 2; }
  .navigator-domain-error { padding: 28px 22px; }
  .navigator-domain-error h1 { font-size: 28px; }
  .navigator-search-home { min-height: 0; height: calc(100% - 38px); padding: 18px 14px 36px; }
  .navigator-search-logo { gap: 8px; margin-bottom: 18px; }
  .navigator-search-logo b { width: 60px; height: 52px; }
  .navigator-search-logo b::after { font-size: 109px; }
  .navigator-search-logo strong::after { font-size: 31px; }
  .navigator-v2 .navigator-search { width: min(100%, 340px); }
  .navigator-directory { padding: 8px 8px 18px; }
  .navigator-v2 .navigator-entry { padding: 12px 28px 11px 46px; border-left-width: 3px; }
  .navigator-v2 .navigator-entry::before { top: 50%; left: 12px; font-size: 21px; }
  .navigator-v2 .navigator-entry::after { right: 8px; }
  .navigator-v2 .navigator-entry strong { font-size: 16px; line-height: 1.12; }
  .navigator-v2 .navigator-entry strong span { display: block; margin-top: 2px; font-size: 14px; }
  .navigator-v2 .navigator-entry small { margin-top: 6px; font-size: 14px; }

  .navi-news__station {
    gap: 8px;
  }

  .navi-news__station > span {
    padding: 5px 6px 2px;
    font-size: 22px;
  }

  .navi-news__station strong {
    font-size: 24px;
  }

  .navi-news__station small,
  .navi-news__signal span,
  .navi-news__section-title span {
    display: none;
  }

  .navi-news__nav {
    font-size: 9px;
  }

  .navi-news__entry {
    grid-template-columns: 34px 72px minmax(0, 1fr);
    gap: 5px;
    padding-block: 5px;
  }

  .navi-news__category {
    display: none;
  }

  .navi-news__entry strong {
    font-size: 13px;
  }

  .navi-news__article-nav {
    padding-inline: 7px;
  }

  .navi-news__article-nav span {
    font-size: 9px;
  }

  .navi-news__article-body {
    width: calc(100% - 24px);
    padding: 18px 0 30px;
    font-size: 12px;
  }

  .navi-news__article-body h1 {
    font-size: 23px;
  }

  .navi-news__article-body img {
    max-height: 240px;
  }

  .navichan-head span {
    display: none;
  }

  .navichan-compose {
    margin: 7px;
  }

  .navichan-compose__fields,
  .navichan-reply-form > div {
    grid-template-columns: 1fr;
  }

  .navichan-compose__fields label,
  .navichan-compose__message,
  .navichan-reply-form label {
    grid-template-columns: 62px minmax(0, 1fr);
  }

  .navichan-feed {
    padding-inline: 7px;
  }

  .navichan-post--reply {
    width: calc(100% - 14px);
    margin-left: 14px;
  }

  .navichan-post__image {
    width: 42%;
  }
}

.navigator-site > div { min-height: 100%; box-sizing: border-box; }
.navigator-site img { display: block; max-width: 100%; }

.hp4 { min-height:100%; padding:16px 10px; color:#e6dfd0; background-color:#0d0b09; background-image:repeating-linear-gradient(0deg,#13110e 0 2px,#0d0b09 2px 4px); font:12px/1.55 Verdana,Tahoma,sans-serif; }
.hp4 header,.hp4 nav,.hp4 main,.hp4 > footer { max-width:660px; margin:0 auto; }
.hp4 header { padding:12px 16px; border:2px outset #6d5c45; background:#241f18; }
.hp4 header span { display:inline-block; padding:1px 6px; color:#241f18; background:#c9a227; font:700 10px Verdana,sans-serif; }
.hp4 h1 { margin:6px 0 3px; color:#f0e6d2; font:bold 24px/1 Georgia,"Times New Roman",serif; letter-spacing:0; }
.hp4 header p { margin:0; color:#9a8b73; font:11px Verdana,sans-serif; }
.hp4 nav { padding:4px 16px; color:#c9a227; background:#12100d; border:1px solid #4a3f31; border-top:0; font:11px Verdana,sans-serif; }
.hp4 main { padding:14px 16px; background:#1a1713; border:1px solid #3d3427; border-top:0; }
.hp4 article { margin:0 0 18px; padding:12px 0 0; border-top:1px dashed #4a3f31; }
.hp4 article:first-child { padding-top:0; border-top:0; }
.hp4 time { color:#c9a227; font:11px Verdana,sans-serif; }
.hp4 h2 { margin:4px 0 8px; color:#f0e6d2; font:bold 13px/1.3 Verdana,sans-serif; text-transform:uppercase; }
.hp4 p { margin:8px 0; }
.hp4-note { color:#c9a227; font-weight:bold; }
.hp4 > footer { padding:8px 16px; border:2px outset #6d5c45; border-top:0; color:#8c8069; background:#241f18; font:10px Verdana,sans-serif; }

.almost-famous { min-height:100%; color:#f5f1e8; background:#0a0909 repeating-linear-gradient(112deg,transparent 0 34px,#201a1a 35px 36px); font:15px/1.5 Arial,sans-serif; padding:22px; }
.almost-famous header { position:relative; border:4px solid #f5f1e8; padding:18px 24px; transform:rotate(-.5deg); background:#151010; box-shadow:10px 10px 0 #c31c28; }
.almost-famous header small { letter-spacing:.2em; }
.almost-famous h1 { margin:8px 0; font:900 clamp(52px,11vw,118px)/.69 Impact,"Arial Black",sans-serif; letter-spacing:-.04em; }
.almost-famous header b { display:inline-block; background:#f5f1e8; color:#111; padding:3px 8px; transform:rotate(1deg); }
.af-grid { display:grid; grid-template-columns:150px 1fr; gap:24px; margin-top:38px; }
.af-grid aside { display:flex; flex-direction:column; gap:4px; border-right:2px solid #c31c28; padding-right:14px; }
.af-grid aside strong,.af-grid aside a { padding:5px; background:#f5f1e8; color:#111; font-weight:bold; }
.af-grid main { max-width:670px; }
.af-grid h2 { font:900 34px/1 Impact,sans-serif; }
.af-grid blockquote { margin:22px 0; border:2px solid #f5f1e8; padding:17px; font:bold 21px Georgia,serif; transform:rotate(.7deg); }
.af-grid blockquote span { font:11px Arial,sans-serif; }
.af-update { display:inline-block; background:#c31c28; padding:7px 10px; font-weight:bold; }

.mum-delete { min-height:100%; color:#43145f; background-color:#cffcff; background-image:radial-gradient(#ff72c4 1.5px,transparent 1.5px),radial-gradient(#8ae100 1.5px,transparent 1.5px); background-position:0 0,10px 10px; background-size:20px 20px; padding:14px; font:15px/1.45 "Comic Sans MS",Trebuchet,sans-serif; }
.mum-delete header { background:#fff36c; border:3px dashed #ff45b5; padding:10px; text-align:center; box-shadow:7px 7px 0 #8ae100; }
.mum-delete marquee { color:#fff; background:#7b2cff; font-weight:bold; }
.mum-delete h1 { margin:7px 0; color:#ff28a1; text-shadow:2px 2px #fff,4px 4px #7b2cff; font-size:clamp(30px,7vw,66px); }
.md-columns { display:grid; grid-template-columns:155px minmax(0,1fr); gap:16px; max-width:850px; margin:24px auto; }
.md-columns aside { background:#7b2cff; color:#fff; border:4px ridge #fff; padding:10px; display:flex; flex-direction:column; gap:7px; }
.md-columns aside a { background:#ff72c4; color:#291038; padding:5px; font-weight:bold; }
.md-columns section { background:#fff; border:3px solid #7b2cff; margin-bottom:15px; padding:14px; box-shadow:6px 6px 0 #ff72c4; }
.md-columns h2 { color:#7b2cff; border-bottom:3px dotted #8ae100; }
.md-counter { margin-top:15px; background:#111; color:#72ff68; padding:8px; text-align:center; font-family:monospace; }
.mum-delete > footer { text-align:center; background:#fff36c; padding:5px; font-weight:bold; }

.hate-cooking { min-height:100%; padding:14px 10px; color:#2a1a12; background-color:#8d8272; background-image:repeating-linear-gradient(90deg,#948976 0 3px,#8d8272 3px 6px); font:13px/1.5 Arial,Helvetica,sans-serif; }
.hate-cooking > header,.hate-cooking > main { max-width:660px; margin:0 auto; }
.hate-cooking header { padding:12px 16px; border:2px outset #d8b56a; background:#8f221e; color:#fff4db; }
.hate-cooking header p { margin:0; font:bold 10px Arial,sans-serif; letter-spacing:.14em; }
.hate-cooking h1 { margin:4px 0 0; font:bold 30px/1.05 "Times New Roman",Times,serif; letter-spacing:0; }
.hate-cooking main { padding:14px 16px; background:#fffdf3; border:1px solid #6b5548; border-top:0; }
.hate-cooking article { display:block; }
.hate-cooking h2 { margin:10px 0 8px; padding-bottom:3px; color:#8f221e; border-bottom:2px solid #8f221e; font:bold 19px/1.2 "Times New Roman",Times,serif; }
.hate-cooking small { color:#7a6552; }
.hate-cooking ol { margin:10px 0 10px 20px; padding:0; }
.hate-cooking li { margin:6px 0; }
.hate-cooking li,.anti-copy li { display:list-item; grid-template-columns:none; gap:0; padding:0; border-top:0; }
.hate-cooking aside { float:right; width:180px; margin:0 0 12px 16px; padding:10px; border:2px inset #b98a7a; background:#fdf3e3; }
.hate-cooking aside b { display:block; margin-bottom:5px; color:#8f221e; letter-spacing:0; font:bold 11px Arial,sans-serif; }
.hate-cooking aside p { margin:0; font-size:12px; }
.hate-cooking footer { clear:both; margin-top:18px; padding-top:8px; border-top:1px solid #b98a7a; color:#6b5548; font:11px Arial,sans-serif; }

.unsent-people { min-height:100%; color:#312d36; background:#eeeaf0; padding:44px clamp(20px,8vw,110px); font:17px/1.8 Georgia,serif; }
.unsent-people header { max-width:620px; margin:0 auto 38px; text-align:center; }
.unsent-people h1 { margin:0; font:400 clamp(32px,6vw,64px)/1.05 Georgia,serif; }
.unsent-people header p { color:#847b88; font-style:italic; }
.unsent-people header img { width:100%; height:170px; margin-top:24px; object-fit:cover; object-position:center; filter:grayscale(.65) contrast(.85); opacity:.72; }
.unsent-people main { max-width:680px; margin:auto; }
.unsent-people article { margin:0 0 28px; padding:24px 28px; background:rgba(255,255,255,.7); box-shadow:0 8px 25px rgba(50,35,50,.08); }
.unsent-people article span { color:#776578; font-style:italic; }
.unsent-people article footer { color:#a39aa5; font:10px Arial,sans-serif; letter-spacing:.13em; text-transform:uppercase; }

.dont-tell-maria { min-height:100%; background:#ffef45; color:#111; padding:16px; font:16px/1.4 Arial,sans-serif; }
.dont-tell-maria header { border:7px solid #111; background:#ff78b8; text-align:center; }
.dont-tell-maria header > div { background:#111; color:#ffef45; padding:4px; font-weight:900; letter-spacing:.18em; }
.dont-tell-maria h1 { margin:12px; font:900 clamp(42px,10vw,102px)/.73 Impact,Arial Black,sans-serif; letter-spacing:-.03em; }
.dont-tell-maria h1 em { color:#fff; -webkit-text-stroke:3px #111; font-style:normal; }
.dont-tell-maria main { display:grid; grid-template-columns:1.6fr .7fr; gap:15px; margin-top:15px; }
.dont-tell-maria main section,.dont-tell-maria main aside { border:5px solid #111; padding:18px; background:#fff; }
.dont-tell-maria section > b { background:#e4003b; color:#fff; padding:4px 8px; }
.dont-tell-maria h2 { font:900 clamp(27px,5vw,55px)/.95 Arial Black,Arial,sans-serif; }
.dont-tell-maria aside h3 { background:#111; color:#fff; padding:5px; }
.dont-tell-maria aside strong { color:#e4003b; float:right; }
.dont-tell-maria > footer { margin-top:15px; background:#111; color:#fff; padding:7px; text-align:center; font-weight:bold; }

.animemory { min-height:100%; background:#e9eef6; color:#1a2940; font:14px/1.55 Verdana,Arial,sans-serif; padding:14px; }
.animemory > header { padding:16px 20px; background:linear-gradient(#fff,#afc8e5); border:1px solid #6683a6; }
.anime-logo { color:#203e70; font:900 clamp(32px,6vw,68px)/.85 Arial Black,Arial,sans-serif; letter-spacing:-.07em; }
.anime-logo span { color:#e25483; }
.animemory > header p { margin:9px 0 0; }
.animemory > nav { background:#294c79; color:#fff; border-bottom:4px solid #e25483; padding:7px 14px; font-size:11px; }
.anime-layout { display:grid; grid-template-columns:minmax(0,1fr) 210px; gap:14px; margin-top:14px; }
.anime-layout main,.anime-layout aside { background:#fff; border:1px solid #91a6bf; padding:17px; }
.anime-layout article + article { border-top:1px dotted #91a6bf; margin-top:26px; padding-top:18px; }
.anime-layout h1,.anime-layout h2 { color:#294c79; }
.anime-layout figure { float:left; width:min(46%,290px); margin:0 18px 12px 0; }
.anime-layout figure img { border:4px solid #d7e1ed; }
.anime-layout figcaption { color:#718198; font-size:9px; }
.anime-score { float:right; display:flex; align-items:center; gap:6px; background:#e25483; color:#fff; padding:8px; margin:0 0 10px 12px; }
.anime-score b { font-size:28px; }
.anime-score span { font-size:9px; }
.anime-layout aside h3 { color:#fff; background:#294c79; padding:5px; font-size:11px; }

.girlfriend404 { min-height:100%; color:#19222c; background:#bec7cf; padding:22px; font:14px/1.5 Tahoma,Arial,sans-serif; }
.girlfriend404 > header { display:flex; align-items:center; gap:18px; border:2px outset #fff; background:#dce2e7; padding:15px; }
.girlfriend404 > header > span { color:#fff; background:#24364c; padding:8px 14px; font:900 55px/1 Arial,sans-serif; box-shadow:4px 4px 0 #80909e; }
.girlfriend404 h1 { margin:0; font:700 clamp(28px,6vw,58px)/1 Arial,sans-serif; letter-spacing:-.05em; }
.girlfriend404 header p { margin:5px 0 0; }
.girlfriend404 > nav { display:flex; gap:2px; padding:3px; background:#8997a5; border:2px inset #fff; }
.girlfriend404 > nav b { flex:1; text-align:center; background:#dce2e7; border:1px outset #fff; padding:5px; font-size:11px; }
.girlfriend404 > main { display:grid; grid-template-columns:minmax(0,1fr) 235px; gap:15px; margin-top:15px; }
.girlfriend404 main > section,.girlfriend404 main > aside { background:#e9edf0; border:2px outset #fff; padding:18px; }
.girlfriend404 h2 { color:#9a1d38; font-size:25px; }
.gf-meta { color:#66727e; font:11px monospace; }
.gf-dialog { width:min(100%,390px); margin:24px auto 0; padding:0 12px 12px; background:#f1f3f4; border:3px outset #fff; box-shadow:6px 6px 0 #6d7882; }
.gf-dialog strong { display:block; margin:0 -12px 10px; padding:4px 8px; color:#fff; background:#24364c; }
.gf-dialog button { float:right; min-width:75px; }
.girlfriend404 aside h3 { margin:0 -8px 10px; padding:4px 8px; color:#fff; background:#24364c; font-size:12px; }
.girlfriend404 dl { display:grid; grid-template-columns:1fr auto; }
.girlfriend404 dd { color:#9a1d38; font-weight:bold; }
.girlfriend404 aside > p { border-bottom:1px dotted #7b8791; padding-bottom:6px; font-family:monospace; }
.girlfriend404 > footer { margin-top:15px; border:2px inset #fff; padding:5px; text-align:center; font-size:10px; }

.anti-navi { min-height:100%; overflow:hidden; color:#111; background:#d9d2bc; padding:20px; font:16px/1.45 Arial,sans-serif; background-image:repeating-linear-gradient(2deg,transparent 0 17px,rgba(0,0,0,.035) 18px); }
.anti-navi > header { position:relative; padding:15px 20px; color:#f2e8cb; background:#111; border:7px solid #e1251b; transform:rotate(-.35deg); box-shadow:9px 9px 0 #111; }
.anti-navi h1 { margin:0; font:900 clamp(58px,12vw,125px)/.66 Impact,Arial Black,sans-serif; letter-spacing:-.04em; }
.anti-navi header p { margin:18px 0 0; color:#ffd81a; font:bold 13px monospace; }
.anti-stamp { position:absolute; right:18px; top:18px; border:4px solid #ffd81a; color:#ffd81a; padding:8px; font:900 18px Arial,sans-serif; transform:rotate(7deg); }
.anti-navi > main { display:grid; grid-template-columns:minmax(0,1fr) 230px; gap:25px; margin-top:36px; }
.anti-navi main > section { border-left:13px solid #e1251b; padding-left:18px; }
.anti-navi h2 { font:900 clamp(35px,7vw,70px)/.9 Impact,Arial Black,sans-serif; }
.anti-navi blockquote { margin:25px 0; padding:12px; color:#ffd81a; background:#111; font:900 26px/1 Arial Black,Arial,sans-serif; transform:rotate(-1deg); }
.anti-navi li { margin:8px 0; }
.anti-box { margin-bottom:16px; border:4px solid #111; background:#ffd81a; padding:12px; box-shadow:6px 6px 0 #e1251b; transform:rotate(1deg); }
.anti-box:nth-child(2) { background:#f0ead7; transform:rotate(-1deg); }
.anti-box b { font:900 21px Impact,Arial,sans-serif; }
.anti-navi > footer { margin-top:25px; background:#e1251b; color:#fff; padding:8px; text-align:center; font-weight:bold; letter-spacing:.1em; }

.pink-page { min-height:100%; overflow:auto; color:#54203f; padding:14px 4%; font:12px/1.35 Verdana,Arial,sans-serif; background:#fff8e8 repeating-linear-gradient(135deg,rgba(255,83,158,.28) 0 12px,transparent 12px 24px); }
.pink-shell { max-width:930px; margin:auto; border:5px solid #ff3b96; border-radius:18px; background:rgba(255,255,255,.93); box-shadow:0 0 0 3px #ffacd0 inset; overflow:hidden; }
.pink-top { display:flex; justify-content:space-between; gap:10px; padding:7px 12px; color:#122b56; background:repeating-linear-gradient(45deg,#ff2f91 0 9px,#ff76b5 9px 18px); font-weight:bold; }
.pink-top span,.pink-top time { background:#d8f8ff; border-radius:12px; padding:3px 8px; }
.pink-page header { position:relative; display:grid; grid-template-columns:38% 1fr; min-height:215px; background:linear-gradient(110deg,#fff,#ffe1ee); border-bottom:4px solid #ff3b96; overflow:hidden; }
.pink-page header img { width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.75) brightness(1.15); opacity:.82; }
.pink-page header > div { align-self:center; padding:16px; text-align:center; }
.pink-page header h1 { margin:4px 0; color:#ff2588; font:italic 900 clamp(42px,8vw,80px)/.8 Arial Black,Arial,sans-serif; letter-spacing:-.08em; -webkit-text-stroke:2px #fff; text-shadow:3px 3px 0 #d0006f; }
.pink-page header p { color:#e40076; font-weight:bold; }
.pink-page > .pink-shell > nav { display:grid; grid-template-columns:repeat(6,1fr); gap:4px; padding:5px; background:#fff; }
.pink-page nav b { padding:8px 4px; text-align:center; color:#fff; border:2px solid #ff3b96; border-radius:14px; background:linear-gradient(#fff,#ff66a8 49%,#e91d78 51%,#ff9bc7); box-shadow:0 2px 3px #888; text-shadow:1px 1px #b0005c; }
.pink-page nav b:nth-child(2n) { border-color:#7c68ed; background:linear-gradient(#fff,#bd9eff 49%,#8058df 51%,#d4c7ff); }
.pink-columns { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:18px; padding:18px; background:rgba(255,255,255,.72); }
.pink-columns section { margin-bottom:16px; border:3px solid #ff3b96; border-radius:15px; background:rgba(255,255,255,.92); padding:10px; box-shadow:4px 4px 0 #ffd0e3; }
.pink-columns h2 { display:inline-block; margin:-24px 0 10px -4px; padding:6px 18px; border-radius:16px 16px 0 0; color:#fff; background:#ff3b96 repeating-linear-gradient(45deg,transparent 0 8px,rgba(255,255,255,.2) 8px 16px); font-size:13px; text-shadow:1px 1px #9b004e; }
.pink-tabs { display:grid; grid-template-columns:repeat(4,1fr); }
.pink-tabs b { padding:4px; color:#fff; background:#ff3b96; text-align:center; font-size:10px; }
.pink-tabs b:nth-child(2) { background:#37bdeb; }.pink-tabs b:nth-child(3) { background:#8bcf48; }.pink-tabs b:nth-child(4) { background:#f2a640; }
.pink-columns ul { max-height:150px; overflow:auto; margin:5px 0 0; padding:0; list-style:none; }
.pink-columns li { padding:5px; border-bottom:1px dashed #ffb4d2; }
.pink-columns mark { color:#fff; background:#ff2588; font-size:9px; }
.pink-media { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; }
.pink-media article { padding:7px; border:3px dotted #39bce8; background:#d9f7ff; text-align:center; }
.pink-media img,.pink-placeholder { width:100%; height:130px; object-fit:cover; }
.pink-placeholder { display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,#ff65ac,#825be2); font-size:70px; }
.pink-blurb { background:linear-gradient(#fff,#efffdd)!important; }
.pink-status { border-color:#27bce7!important; color:#17536f; }
.pink-page .pink-shell > footer { padding:8px; color:#fff; background:#ff3b96; text-align:center; font-weight:bold; }

.almost-famous { min-height:100%; padding:12px; color:#ddd; background:#000033; font:13px/1.35 Verdana,Arial,sans-serif; }
.almost-famous header { padding:7px; border:2px ridge #999; transform:none; background:#000; box-shadow:none; text-align:center; }
.almost-famous header h1 { margin:3px; color:#ff0; font:bold 38px/1 "Times New Roman",serif; letter-spacing:0; text-shadow:2px 2px #f00; }
.almost-famous header p { margin:3px; color:#fff; }
.almost-famous marquee { display:block; color:#0ff; border-top:1px solid #666; margin-top:6px; padding:4px; }
.almost-famous table { width:min(720px,100%); margin:10px auto; border:3px ridge #aaa; border-collapse:separate; background:#11114c; }
.almost-famous td { vertical-align:top; border:1px solid #777; padding:9px; }
.almost-famous .af-menu { width:125px; color:#ff0; background:#000; text-align:center; }
.almost-famous .af-menu a { display:block; margin:7px 0; color:#0ff; text-decoration:underline; }
.almost-famous .af-main h2 { color:#ff0; background:#000; border-bottom:1px dashed #f00; padding:3px; font:bold 15px Verdana,sans-serif; }
.almost-famous .af-main p { margin:10px 4px; }
.almost-famous .af-sign { text-align:right; color:#0ff; }
.almost-famous > footer { color:#999; text-align:center; font-size:10px; }

.unsent-people { min-height:100%; padding:18px; color:#bbb; background:#080808; font:13px/1.45 "Courier New",monospace; }
.unsent-people header { max-width:700px; margin:0 auto 14px; padding-bottom:8px; border-bottom:1px solid #555; text-align:left; }
.unsent-people h1 { margin:0; color:#fff; font:normal 24px/1.1 "Courier New",monospace; text-transform:lowercase; }
.unsent-people header p { margin:5px 0; color:#777; font-style:normal; }
.unsent-people main { max-width:700px; margin:auto; }
.unsent-people article { margin:0; padding:12px 4px; border-bottom:1px dashed #444; background:none; box-shadow:none; }
.unsent-people article span { color:#777; font-style:normal; font-size:11px; }
.unsent-people article p { margin:6px 0; }
.unsent-end { color:#777; text-align:center; }

.anti-navi { min-height:100%; padding:8px; overflow:auto; color:#d5d5d5; background:#000; background-image:none; font:13px/1.35 Arial,sans-serif; }
.anti-navi > header { padding:8px; color:#fff; background:#300; border:3px double #f00; transform:none; box-shadow:none; text-align:center; }
.anti-navi h1 { margin:0; color:#f00; font:bold 34px/1 "Courier New",monospace; letter-spacing:2px; }
.anti-navi header p { margin:5px; color:#fff; font:12px "Courier New",monospace; }
.anti-navi table { width:min(760px,100%); margin:10px auto; border:2px solid #900; border-collapse:collapse; }
.anti-navi td { vertical-align:top; border:1px solid #700; padding:9px; }
.anti-menu { width:135px; color:#aaa; background:#160000; }
.anti-menu > b { display:block; color:#f33; margin-bottom:8px; }
.anti-menu a { display:block; color:#f66; margin:6px 0; text-decoration:underline; }
.anti-copy { background:#090909; }
.anti-copy h2 { margin:3px 0 8px; padding:3px; color:#000; background:#f00; font:bold 14px "Courier New",monospace; }
.anti-copy p,.anti-copy li { margin-top:7px; }
.anti-sign { color:#777; text-align:right; }
.anti-navi > footer { margin-top:8px; padding:5px; color:#f66; background:#160000; border:1px solid #700; font:11px "Courier New",monospace; }

.girlfriend404 { min-height:100%; padding:14px 10px; color:#1c1c1c; background-color:#3b3f57; background-image:repeating-linear-gradient(45deg,#424763 0 8px,#3b3f57 8px 16px); font:12px/1.5 Verdana,Tahoma,sans-serif; }
.girlfriend404 > header,.girlfriend404 > nav,.girlfriend404 > main,.girlfriend404 > footer { max-width:640px; margin:0 auto; }
.girlfriend404 > header { display:block; padding:10px; border:3px ridge #b9c0d8; background:#e9ebf5; text-align:center; }
.girlfriend404 h1 { margin:0; color:#3f3577; font:bold 30px/1 Georgia,"Times New Roman",serif; letter-spacing:0; text-shadow:1px 1px 0 #fff; }
.girlfriend404 header p { margin:4px 0 0; color:#5b6284; }
.girlfriend404 > nav { display:block; padding:4px 8px; border:2px inset #b9c0d8; border-top:0; background:#ccd2e6; font:11px Verdana,sans-serif; }
.girlfriend404 > nav a { color:#3f3577; text-decoration:underline; }
.girlfriend404 > main { display:grid; grid-template-columns:minmax(0,1fr) 170px; gap:18px; padding:12px 10px; border:2px inset #b9c0d8; border-top:0; background:#f2f3fa; }
.girlfriend404 main > section { padding:0; border:0; background:none; }
.girlfriend404 article { margin:0 0 12px; padding:0 0 12px; border-bottom:1px dotted #8e97b8; }
.girlfriend404 article:last-child { margin-bottom:0; padding-bottom:0; border-bottom:0; }
.girlfriend404 h2 { margin:0 0 5px; color:#3f3577; font:bold 13px/1.4 Verdana,sans-serif; }
.girlfriend404 p { margin:6px 0; }
.girlfriend404 main > aside { align-self:start; margin:0; padding:10px; border:1px solid #8e97b8; background:#e6e8f2; color:#3c3f52; font:11px/1.45 Verdana,sans-serif; }
.girlfriend404 aside h3 { margin:9px 0 4px; padding:2px 4px; color:#fff; background:#5b4fa0; font-size:11px; }
.girlfriend404 aside h3:first-child { margin-top:0; }
.girlfriend404 aside p { margin:4px 0; padding:0; border-bottom:0; font-family:inherit; }
.girlfriend404 aside a { color:#3f3577; text-decoration:underline; }
.girlfriend404 > footer { margin-top:10px; padding:6px; border:2px inset #b9c0d8; background:#ccd2e6; color:#5b6284; text-align:center; font:10px Verdana,sans-serif; }

.dont-tell-maria { min-height:100%; padding:10px; color:#32121e; background:#ffd5e1; font:13px/1.4 Verdana,Arial,sans-serif; }
.dont-tell-maria header { border:4px double #6f1640; background:#fff; text-align:left; }
.dont-tell-maria header > div { padding:3px 8px; color:#fff; background:#6f1640; letter-spacing:0; }
.dont-tell-maria h1 { margin:8px; color:#d72c70; font:bold 34px/1 Georgia,serif; letter-spacing:-1px; }
.dont-tell-maria h1 em { color:#6f1640; -webkit-text-stroke:0; font-style:italic; }
.dont-tell-maria header p { margin:8px; }
.dont-tell-maria main { display:block; max-width:760px; margin:10px auto; }
.dont-tell-maria main article { margin-bottom:10px; padding:10px; border:2px solid #a83361; background:#fff; }
.dont-tell-maria main article time { color:#8e6c78; font-size:10px; }
.dont-tell-maria h2 { margin:5px 0; color:#6f1640; font:bold 17px/1.2 Arial,sans-serif; }
.maria-comment { margin:10px 0 0 35px; padding:7px; color:#333; background:#fff4a8; border:1px solid #d1a800; font-size:12px; }
.maria-comment b { color:#c00046; }
.dont-tell-maria > footer { margin-top:10px; padding:5px; color:#fff; background:#6f1640; }

.anime-mini-score { float:right; margin:0 0 8px 10px; padding:5px 8px; color:#fff; background:#294c79; font:bold 18px Arial,sans-serif; }
.anime-drop { background:#8f1f34; font-size:12px; }

.pink-page { min-height:100%; padding:14px; overflow:auto; color:#5b3150; background:#ffe8f1; background-image:repeating-linear-gradient(90deg,transparent 0 19px,rgba(255,255,255,.5) 20px); font:13px/1.45 Verdana,Arial,sans-serif; }
.pink-shell { max-width:690px; margin:auto; border:3px solid #e16a9e; border-radius:0; background:#fff8fc; box-shadow:5px 5px 0 #c98ead; overflow:hidden; }
.pink-page header { display:grid; grid-template-columns:1fr 220px; min-height:155px; background:#f9bfd8; border-bottom:3px solid #e16a9e; }
.pink-page header > div { align-self:center; padding:18px; text-align:left; }
.pink-page header small { color:#8c4669; }
.pink-page header h1 { margin:3px 0; color:#b62f70; font:normal 42px/1 Georgia,serif; letter-spacing:-2px; -webkit-text-stroke:0; text-shadow:2px 2px #fff; }
.pink-page header p { margin:4px 0; color:#70314f; }
.pink-page header img { width:220px; height:155px; object-fit:cover; object-position:center; filter:saturate(.7) brightness(1.1); opacity:.8; }
.pink-simple { display:grid; grid-template-columns:minmax(0,1fr) 170px; gap:14px; padding:14px; }
.pink-simple section { margin-bottom:14px; padding:9px; border:1px solid #dc92b4; background:#fff; }
.pink-simple h2 { margin:0 0 7px; padding-bottom:3px; color:#b62f70; border-bottom:1px dotted #d66d9e; font:bold 14px Georgia,serif; }
.pink-simple aside { padding:9px; border-left:1px solid #dc92b4; font-size:12px; }
.pink-simple a { color:#c1266c; text-decoration:underline; }
.pink-counter { margin-top:15px; padding:4px; color:#fff; background:#b62f70; font:10px monospace; text-align:center; }
.pink-page .pink-shell > footer { padding:6px; color:#fff; background:#b62f70; font-size:10px; }

.navigator-tab-viewport { container: navigator-content / inline-size; }

@container navigator-content (max-width: 560px) {
  .hate-cooking main { padding:20px 16px; }
  .hate-cooking article { display:block; }
  .hate-cooking article > div { width:100%; min-width:0; }
  .hate-cooking ol { padding-left:24px; }
  .hate-cooking aside { float:none; width:auto; margin:0 0 12px; }

  .anti-navi table,.anti-navi tbody,.anti-navi tr,.anti-navi td,
  .almost-famous table,.almost-famous tbody,.almost-famous tr,.almost-famous td { display:block; width:auto; min-width:0; }
  .anti-menu,.almost-famous .af-menu { width:auto; }
  .anti-menu a,.almost-famous .af-menu a { display:inline-block; margin:5px 8px 5px 0; }
  .anti-copy,.almost-famous .af-main { overflow-wrap:anywhere; }
}

@media (max-width: 560px) {
  .hp4 main,.af-grid,.md-columns,.hate-cooking article,.dont-tell-maria main,.anime-layout,.girlfriend404 > main,.anti-navi > main,.pink-columns { grid-template-columns:1fr; }
  .af-grid aside { display:grid; grid-template-columns:repeat(2,1fr); border-right:0; }
  .md-columns { margin-top:18px; }
  .hate-cooking main,.hate-cooking header { padding-left:17px; padding-right:17px; }
  .dont-tell-maria h1 em { -webkit-text-stroke:2px #111; }
  .anime-layout figure { width:100%; float:none; margin:0 0 12px; }
  .girlfriend404 { padding:8px; }
  .girlfriend404 > header { align-items:flex-start; }
  .girlfriend404 > header > span { font-size:38px; }
  .anti-navi { padding:10px; }
  .anti-stamp { right:8px; top:8px; font-size:13px; }
  .pink-page { padding:5px; }
  .pink-shell { border-width:3px; border-radius:10px; }
  .pink-page header { grid-template-columns:1fr; }
  .pink-page header img { width:100%; height:180px; }
  .pink-page > .pink-shell > nav { grid-template-columns:repeat(3,1fr); }
  .pink-columns { padding:13px 8px; }
  .pink-media { grid-template-columns:1fr; }
  .pink-simple { grid-template-columns:1fr; padding:8px; }
  .pink-simple aside { border-left:0; border-top:1px solid #dc92b4; }
  .almost-famous,.anti-navi { overflow-x:hidden; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .booting .launcher {
    opacity: 1;
  }

  .boot-screen::after,
  .boot-prompt i {
    animation: none !important;
  }

  .navi-news__ticker span {
    animation: none !important;
  }

  .signal-scanner__field i {
    left: 50%;
    animation: none !important;
  }

  .signal-scanner__state > strong i {
    animation: none !important;
  }

}