html, body {
  margin: 0;
  min-height: 100%;
  background: #000;
}
button:not(:disabled), [role="button"]:not(:disabled) { cursor: pointer; }

@font-face {
  font-family: "Pixelated MS Sans Serif";
  src: url("https://unpkg.com/98.css@0.1.20/dist/ms_sans_serif.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Pixelated MS Sans Serif";
  src: url("https://unpkg.com/98.css@0.1.20/dist/ms_sans_serif_bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

.desk {
  --grey: #050505;
  --grey-light: #ff2bd6;
  --grey-dark: #5a003d;
  --navy: #000;
  --navy-2: #ff2bd6;
  --teal: #000;
  --font-ui: Tahoma, "Pixelated MS Sans Serif", "MS Sans Serif", sans-serif;
  min-height: 100vh;
  min-height: 100dvh;
  background: var(--teal);
  display: flex;
  flex-direction: column;
  padding: 6px 6px 0;
  box-sizing: border-box;
  font-family: var(--font-ui);
  font-size: 12px;
  color: #ff2bd6;
}

.desk * {
  border-radius: 0 !important;
  box-sizing: border-box;
}

.desk ::selection {
  background: #ff2bd6;
  color: #000;
}

.ns-win {
  flex: 1;
  min-height: 0;
  background: var(--grey);
  border-top: 2px solid var(--grey-light);
  border-left: 2px solid var(--grey-light);
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  display: flex;
  flex-direction: column;
  padding: 2px;
}

.ns-title {
  height: 20px;
  background: #000080;
  color: #ff2bd6;
  display: flex;
  align-items: center;
  padding: 0 3px 0 4px;
  font-size: 12px;
  font-weight: 700;
  user-select: none;
  gap: 6px;
}

.ns-title img {
  width: 16px;
  height: 16px;
  image-rendering: pixelated;
}

.ns-title-label {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ns-win-btns {
  display: flex;
  gap: 1px;
  background: var(--grey);
  border-top: 1px solid var(--grey-dark);
  border-left: 1px solid var(--grey-dark);
  border-right: 1px solid #ff2bd6;
  border-bottom: 1px solid #ff2bd6;
  padding: 1px;
}

.ns-win-btn {
  width: 16px;
  height: 14px;
  padding: 0;
  background: var(--grey);
  color: #ff2bd6;
  border-top: 1px solid #ff2bd6;
  border-left: 1px solid #ff2bd6;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  box-shadow: inset -1px -1px var(--grey-dark);
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.ns-win-btn.close {
  margin-left: 2px;
}

.ns-win-btn:active {
  border-color: #000 #ff2bd6 #ff2bd6 #000;
  box-shadow: none;
}

.ns-menu {
  display: flex;
  background: var(--grey);
  padding: 1px 2px;
  user-select: none;
  position: relative;
}

.ns-menu-item {
  position: relative;
}

.ns-menu-btn {
  background: none;
  border: 1px solid transparent;
  font-family: var(--font-ui);
  font-size: 12px;
  padding: 1px 8px;
  cursor: pointer;
  color: #ff2bd6;
}

.ns-menu-item.open .ns-menu-btn,
.ns-menu-btn:hover {
  background: #ff2bd6;
  color: #000;
}

.ns-drop {
  display: none;
  position: absolute;
  z-index: 50;
  top: 100%;
  left: 0;
  min-width: 170px;
  background: var(--grey);
  border-top: 1px solid #ff2bd6;
  border-left: 1px solid #ff2bd6;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  box-shadow: 2px 2px 0 rgb(0 0 0 / 35%);
  padding: 2px 0;
}

.ns-menu-item.open .ns-drop {
  display: block;
}

.ns-drop a,
.ns-drop button {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: 0;
  color: #ff2bd6;
  font-family: var(--font-ui);
  font-size: 12px;
  padding: 3px 18px;
  cursor: pointer;
  text-decoration: none;
}

.ns-drop a:hover,
.ns-drop button:hover {
  background: #ff2bd6;
  color: #000;
  text-decoration: none;
}

.ns-drop .dead {
  color: var(--grey-dark);
  text-shadow: 1px 1px 0 #ff2bd6;
  cursor: default;
}

.ns-drop .dead:hover {
  background: none;
  color: var(--grey-dark);
}

.ns-sep {
  height: 1px;
  background: var(--grey-dark);
  border-bottom: 1px solid #ff2bd6;
  margin: 3px 2px;
}

.ns-nav {
  display: flex;
  align-items: stretch;
  background: var(--grey);
  border-top: 1px solid #ff2bd6;
  padding: 4px 6px 5px;
  gap: 3px;
  flex-wrap: nowrap;
  overflow-x: auto;
  min-height: 62px;
}

.ns-vdiv {
  width: 2px;
  align-self: stretch;
  margin: 4px 4px;
  border-left: 1px solid var(--grey-dark);
  border-right: 1px solid #ff2bd6;
}

.ns-tool {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-width: 58px;
  min-height: 52px;
  padding: 4px 8px 3px;
  background: var(--grey);
  border-top: 2px solid #ff2bd6;
  border-left: 2px solid #ff2bd6;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  box-shadow: inset -1px -1px var(--grey-dark), inset 1px 1px var(--grey-light);
  color: #ff2bd6;
  text-decoration: none;
  font-size: 11px;
  font-family: var(--font-ui);
  cursor: pointer;
}

.ns-tool img {
  width: 32px;
  height: 32px;
  image-rendering: pixelated;
  margin-bottom: 2px;
}

.ns-tool:hover {
  color: #ff2bd6;
  text-decoration: none;
}

.ns-tool:active,
.ns-tool.in {
  border-top: 2px solid #000;
  border-left: 2px solid #000;
  border-right: 2px solid #ff2bd6;
  border-bottom: 2px solid #ff2bd6;
  box-shadow: inset 1px 1px var(--grey-dark);
  padding: 5px 7px 2px 9px;
}

.ns-tool.dead,
.ns-tool:disabled {
  pointer-events: none;
  cursor: default;
}

.ns-tool.dead:active {
  border-top: 2px solid #ff2bd6;
  border-left: 2px solid #ff2bd6;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  box-shadow: inset -1px -1px var(--grey-dark), inset 1px 1px var(--grey-light);
  padding: 4px 8px 3px;
}

.ns-tool.dim {
  color: var(--grey-dark);
}

.ns-tool.dim img {
  opacity: 0.45;
}

.ns-nav-end {
  margin-left: auto;
  display: flex;
  align-items: center;
  padding: 0 8px;
}

.ns-nav-end img {
  width: 40px;
  height: 40px;
  image-rendering: pixelated;
}

.ns-loc {
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--grey);
  padding: 5px 8px;
  font-size: 12px;
  flex-wrap: nowrap;
  border-top: 1px solid #ff2bd6;
}

.ns-loc-lab {
  white-space: nowrap;
  font-size: 12px;
}

.ns-url {
  flex: 1;
  min-width: 0;
  background: #ff2bd6;
  color: #ff2bd6;
  font-family: "Courier New", Courier, monospace;
  font-size: 13px;
  padding: 4px 8px;
  border-top: 2px solid var(--grey-dark);
  border-left: 2px solid var(--grey-dark);
  border-right: 2px solid #ff2bd6;
  border-bottom: 2px solid #ff2bd6;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 22px;
}

.ns-related {
  font-family: var(--font-ui);
  font-size: 11px;
  background: var(--grey);
  border-top: 2px solid #ff2bd6;
  border-left: 2px solid #ff2bd6;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  box-shadow: inset -1px -1px var(--grey-dark);
  padding: 4px 10px;
  cursor: pointer;
  white-space: nowrap;
  min-height: 22px;
}

.ns-personal {
  display: flex;
  align-items: center;
  gap: 2px;
  background: var(--grey);
  border-top: 1px solid var(--grey-dark);
  border-bottom: 1px solid #ff2bd6;
  padding: 3px 6px;
  overflow: auto;
  min-height: 26px;
}

.ns-pbtn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 6px;
  color: #ff2bd6;
  text-decoration: none;
  font-size: 11px;
  white-space: nowrap;
  border: 1px solid transparent;
  background: transparent;
  font-family: var(--font-ui);
}

.ns-pbtn img {
  width: 16px;
  height: 16px;
  image-rendering: pixelated;
}

.ns-pbtn:hover {
  border-top: 1px solid #ff2bd6;
  border-left: 1px solid #ff2bd6;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  color: #ff2bd6;
  text-decoration: none;
}

.ns-pbtn.on,
.ns-pbtn.hit,
.ns-pbtn:active {
  border-top: 1px solid #000;
  border-left: 1px solid #000;
  border-right: 1px solid #ff2bd6;
  border-bottom: 1px solid #ff2bd6;
  background: #ff2bd6;
}

.ns-pbtn.hit {
  background: #d4d0c8;
}

.ns-body {
  flex: 1;
  min-height: 0;
  display: flex;
  background: var(--grey);
  border-top: 1px solid var(--grey-dark);
}

.ns-page {
  flex: 1;
  min-width: 0;
  background: #ff2bd6;
  color: #ff2bd6;
  overflow: auto;
  font-family: "Times New Roman", Times, serif;
  font-size: 16px;
  line-height: 1.35;
  border-top: 1px solid var(--grey-dark);
  border-left: 1px solid var(--grey-dark);
  border-right: 1px solid #ff2bd6;
  border-bottom: 1px solid #ff2bd6;
}

.ns-page a {
  color: #00e;
  text-decoration: underline;
}

.ns-page a:visited {
  color: #551a8b;
}

.ns-wrap {
  padding: 18px 22px 40px;
}

.ns-layout {
  width: 100%;
  table-layout: fixed;
}

.ns-main {
  width: auto;
}

.ns-side {
  width: 260px;
  padding: 18px 14px 28px 0;
  background: #ff2bd6;
}

.ns-sidebox {
  margin: 0 0 14px !important;
  font-size: 14px !important;
}

.ns-banner {
  background: #000080;
  color: #ff2bd6;
  text-align: center;
  font-family: "Times New Roman", Times, serif;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 10px 36px;
  margin: 0 auto 18px;
  width: 72%;
  max-width: 560px;
  border-top: 2px solid #6688cc;
  border-left: 2px solid #6688cc;
  border-right: 2px solid #000040;
  border-bottom: 2px solid #000040;
}

.ns-page h1 {
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 16px;
  font-family: "Times New Roman", Times, serif;
}

.ns-page h2 {
  font-size: 18px;
  font-weight: 700;
  margin: 22px 0 8px;
  font-family: "Times New Roman", Times, serif;
}

.ns-page p {
  margin: 0 0 12px;
}

.ns-page ul {
  margin: 0 0 12px 22px;
}

.ns-shot {
  float: left;
  margin: 0 16px 8px 0;
}

.ns-shot img {
  display: block;
  width: 180px;
  height: auto;
  border: 2px solid #000;
  background: #0dda08;
}

.ns-cap {
  font-style: italic;
  font-size: 13px;
  margin: 4px 0 12px;
  color: #ff2bd6;
}

.ns-clear {
  clear: both;
}

.ns-page table.old {
  border: 1px solid #000;
  border-collapse: collapse;
  background: #ff2bd6;
  margin: 8px 0 16px;
  font-size: 15px;
}

.ns-page table.old th,
.ns-page table.old td {
  border: 1px solid #000;
  padding: 4px 8px;
  text-align: left;
  vertical-align: top;
}

.ns-page table.old th {
  background: #c0c0c0;
  font-weight: 700;
}

.ns-empty {
  font-style: italic;
  color: #333;
}

.ns-mono {
  font-family: "Courier New", Courier, monospace;
  font-size: 14px;
}

.ns-favs {
  width: 28px;
  flex-shrink: 0;
  background: var(--grey);
  border-left: 2px solid #ff2bd6;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.ns-fav-tab {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  background: #c00;
  color: #ff2bd6;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  padding: 14px 5px;
  letter-spacing: 0.08em;
  user-select: none;
}

.ns-fav-ico {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 2px;
  border: 1px solid transparent;
}

.ns-fav-ico img {
  width: 16px;
  height: 16px;
  image-rendering: pixelated;
}

.ns-fav-ico:hover {
  border-top: 1px solid #ff2bd6;
  border-left: 1px solid #ff2bd6;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
}

.ns-status {
  display: flex;
  align-items: stretch;
  background: var(--grey);
  min-height: 22px;
  font-size: 11px;
  padding: 2px;
  gap: 2px;
}

.ns-stat {
  padding: 3px 8px;
  border-top: 1px solid var(--grey-dark);
  border-left: 1px solid var(--grey-dark);
  border-right: 1px solid #ff2bd6;
  border-bottom: 1px solid #ff2bd6;
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  display: flex;
  align-items: center;
}

.ns-stat-ico {
  flex: 0 0 auto;
  width: 22px;
  padding: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid var(--grey-dark);
  border-left: 1px solid var(--grey-dark);
  border-right: 1px solid #ff2bd6;
  border-bottom: 1px solid #ff2bd6;
}

.ns-stat-ico img {
  width: 16px;
  height: 16px;
  image-rendering: pixelated;
}

.taskbar {
  height: 32px;
  flex-shrink: 0;
  margin: 3px -6px 0;
  background: var(--grey);
  border-top: 2px solid #ff2bd6;
  display: flex;
  align-items: center;
  padding: 3px 4px 3px;
  gap: 4px;
}

.start {
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 700;
  font-size: 12px;
  font-style: italic;
  background: var(--grey);
  border-top: 2px solid #ff2bd6;
  border-left: 2px solid #ff2bd6;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  padding: 2px 10px 2px 6px;
  cursor: pointer;
  font-family: var(--font-ui);
  color: #ff2bd6;
}

.start img {
  width: 16px;
  height: 16px;
  image-rendering: pixelated;
}

.start:active,
.start.on {
  border-color: #000 #ff2bd6 #ff2bd6 #000;
}

.task {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 148px;
  max-width: 190px;
  height: 24px;
  padding: 0 8px;
  background: var(--grey);
  border-top: 2px solid #ff2bd6;
  border-left: 2px solid #ff2bd6;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  font-size: 11px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.task img {
  width: 16px;
  height: 16px;
  image-rendering: pixelated;
}

.task.on,
.task.hit {
  border-color: #000 #ff2bd6 #ff2bd6 #000;
  background: #ff2bd6;
  box-shadow: inset 1px 1px var(--grey-dark);
}

.task.ghost {
  text-decoration: none;
  color: inherit;
}

.ns-related.dead {
  pointer-events: none;
  cursor: default;
}

.tray {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 5px;
  border-top: 1px solid var(--grey-dark);
  border-left: 1px solid var(--grey-dark);
  border-right: 1px solid #ff2bd6;
  border-bottom: 1px solid #ff2bd6;
  padding: 2px 10px;
  height: 24px;
  font-size: 11px;
  font-family: var(--font-ui);
}

.tray img {
  width: 16px;
  height: 16px;
  image-rendering: pixelated;
}

.ns-field-row {
  margin: 8px 0 14px;
}

.ns-field-row input,
.ns-field {
  font-family: "Courier New", Courier, monospace;
  font-size: 14px;
  border: 2px inset #808080;
  background: #ff2bd6;
  color: #ff2bd6;
  padding: 3px 6px;
  width: 100%;
  max-width: 480px;
}

@media (max-width: 720px) {
  .desk {
    padding: 0;
  }

  .taskbar {
    margin: 0;
  }

  .ns-favs {
    display: none;
  }

  .ns-side {
    display: none;
  }

  .ns-tool {
    min-width: 44px;
    min-height: 44px;
    padding: 2px 4px 1px;
    font-size: 10px;
  }

  .ns-nav-end {
    display: none;
  }

  .ns-wrap {
    padding: 14px 12px 28px;
  }

  .ns-shot {
    float: none;
    margin: 0 0 8px;
  }

  .task {
    min-width: 0;
    max-width: 110px;
  }

  .task.ghost {
    display: none;
  }
}

.ns-related {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: inherit;
}

.start-wrap {
  position: relative;
}

.start-menu {
  position: absolute;
  left: 0;
  bottom: 28px;
  width: 180px;
  background: var(--grey);
  border-top: 2px solid #ff2bd6;
  border-left: 2px solid #ff2bd6;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  z-index: 40;
  padding: 2px;
}

.start-menu[hidden] {
  display: none;
}

.start-menu a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  color: #ff2bd6;
  text-decoration: none;
  font-family: var(--font-ui);
  font-size: 12px;
}

.start-menu a:hover {
  background: #ff2bd6;
  color: #000;
}

.start-menu img {
  width: 16px;
  height: 16px;
  image-rendering: pixelated;
}

.ns-lede {
  font-size: 15px;
  font-weight: 700;
  margin: 0 0 18px;
}

.ns-tape h1 {
  font-size: 28px;
  margin: 4px 0 8px;
}

.ns-tape h2 {
  font-size: 18px;
  margin-top: 22px;
}

.ns-notes {
  margin-top: 36px;
  padding-top: 16px;
  border-top: 2px solid var(--grey-dark);
  opacity: 0.92;
}

.ns-bags {
  margin: 8px 0 16px;
}

.ns-bags-lg .ns-bag {
  padding: 12px 14px;
  margin-bottom: 10px;
  min-height: 72px;
}

.ns-bags-lg .ns-bag img,
.ns-bags-lg .ns-dot {
  width: 56px;
  height: 56px;
}

.ns-bags-lg .sym {
  font-size: 22px;
  line-height: 1.1;
}

.ns-bags-lg .sub {
  font-size: 13px;
  margin-top: 4px;
}

.ns-bags-lg .ns-bag-usd {
  font-size: 14px;
}

.ns-bags-lg .ns-bag-usd b {
  font-size: 20px;
}

.ns-bag {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px;
  margin-bottom: 6px;
  background: #dfdfdf;
  border-top: 2px solid #ff2bd6;
  border-left: 2px solid #ff2bd6;
  border-right: 2px solid #808080;
  border-bottom: 2px solid #808080;
}

.ns-bag img,
.ns-dot {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  background: #c0c0c0;
  border: 1px solid #808080;
  object-fit: cover;
  image-rendering: auto;
}

.ns-dot {
  display: inline-block;
}

.ns-bag-meta {
  flex: 1;
  min-width: 0;
}

.ns-bag .sym {
  font-weight: 700;
  font-size: 13px;
}

.ns-bag .sub {
  color: #000080;
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ns-bag-usd {
  text-align: right;
  font-family: "Courier New", monospace;
  font-size: 12px;
}

.ns-bag-usd b {
  display: block;
}

.ns-bag-usd .up {
  color: #008000;
}

.ns-bag-usd .dn {
  color: #800000;
}

.ns-bags .ns-empty {
  padding: 8px;
  font-style: italic;
}


/* fiona lock: black + dusty rose, readable, big type */
html, body, .desk { background: #000 !important; color: #f3b6c8 !important; font-size: 18px !important; }
.ns-win, .ns-page, .ns-wrap, .ns-body, .ns-menu, .ns-nav, .ns-loc, .ns-personal, .ns-status, .taskbar, .start-menu, .ns-drop, .ns-favs {
  background: #000 !important;
  color: #f3b6c8 !important;
}
.ns-title { background: #000 !important; color: #f3b6c8 !important; font-size: 16px !important; }
.ns-title .ns-brand-ico { filter: none !important; width: 18px; height: 18px; }
a, button, .ns-pbtn, .ns-tool, .start, .task, h1, h2, p, td, th, .ns-banner, .ns-lede, .ns-mono, .ns-empty, .sym, .sub, li {
  color: #f3b6c8 !important;
}
.ns-pbtn, .ns-tool, .start, .task, .ns-win-btn, .ns-field, input {
  background: #000 !important;
  color: #f3b6c8 !important;
  border-color: #c47a93 !important;
}
.ns-pbtn { font-size: 16px !important; padding: 6px 12px !important; }
.ns-tool { font-size: 14px !important; }
h1 { font-size: 42px !important; line-height: 1.15 !important; margin: 8px 0 16px !important; }
h2 { font-size: 26px !important; margin: 28px 0 12px !important; }
p, li { font-size: 18px !important; line-height: 1.45 !important; }
.ns-banner { font-size: 20px !important; letter-spacing: 0.08em; }
.ns-lede { font-size: 20px !important; font-weight: 700; }
table.old, table.old th, table.old td {
  background: #000 !important;
  color: #f3b6c8 !important;
  border-color: #c47a93 !important;
  font-size: 18px !important;
  padding: 10px 12px !important;
}
.ns-bags .ns-bag { background: #0a0a0a !important; border: 1px solid #c47a93 !important; color: #f3b6c8 !important; }
.ns-bags-lg .ns-bag { padding: 16px 18px !important; min-height: 88px !important; margin-bottom: 14px !important; }
.ns-bags-lg .ns-bag img, .ns-bags-lg .ns-dot { width: 64px !important; height: 64px !important; }
.ns-bags-lg .sym { font-size: 28px !important; }
.ns-bags-lg .sub { font-size: 16px !important; }
.ns-bags-lg .ns-bag-usd b { font-size: 24px !important; }
.ns-bag-usd .up { color: #9ed9b0 !important; }
.ns-bag-usd .dn { color: #e89aa0 !important; }
.desk ::selection { background: #c47a93; color: #000; }
.ns-nav img, .ns-pbtn img, .task img, .start img, .ns-fav-ico img, .tray img, .ns-stat-ico img {
  filter: none;
  opacity: 0.85;
}
.ns-empty { font-size: 18px !important; }

