/* ══════════════════════════════════════════
   334DIGITAL — site-nav.css
   A tiny, namespaced "site dock" for the standalone toys/apps
   (calculators, games, desktops) that have no nav of their own.
   Everything is prefixed .s334- so it can't collide with page styles.
   Markup: <details class="s334-dock"> … see any app page.
   Remove the <details> block + this <link> to revert a page.
══════════════════════════════════════════ */
.s334-dock {
  position: fixed; top: 10px; right: 10px; z-index: 2147483000;
  font: 18px/1.1 'VT323', 'Share Tech Mono', ui-monospace, monospace;
  letter-spacing: 2px; text-transform: uppercase;
  color: #00ffe7; text-align: left;
  margin: 0; padding: 0; border: 0; background: none;
  -webkit-font-smoothing: antialiased;
}
.s334-dock.s334-bl { top: auto; right: auto; bottom: 10px; left: 10px; }
.s334-dock.s334-br { top: auto; bottom: 10px; }
.s334-dock.s334-tl { right: auto; left: 10px; }
.s334-dock > summary {
  list-style: none; cursor: pointer; user-select: none;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 10px 4px;
  background: rgba(5,0,10,.86); color: #00ffe7;
  border: 1px solid #00ffe7;
  box-shadow: 0 0 10px rgba(0,255,231,.35), inset 0 0 8px rgba(255,45,120,.18);
  text-shadow: 0 0 6px rgba(0,255,231,.7);
  opacity: .8; transition: opacity .15s, color .15s, border-color .15s;
}
.s334-dock > summary::-webkit-details-marker { display: none; }
.s334-dock > summary::marker { content: ''; }
.s334-dock > summary:hover,
.s334-dock[open] > summary { opacity: 1; color: #ffe600; border-color: #ffe600; }
.s334-dock .s334-mark { color: #ff2d78; }
.s334-dock > nav {
  display: flex; flex-direction: column; min-width: 150px;
  margin-top: 6px; padding: 6px 0;
  background: rgba(5,0,10,.95);
  border: 1px solid rgba(0,255,231,.45); border-top: 2px solid #ff2d78;
  box-shadow: 0 0 18px rgba(180,0,255,.45);
}
.s334-dock.s334-bl > nav, .s334-dock.s334-br > nav { position: absolute; bottom: 100%; margin: 0 0 6px; }
.s334-dock.s334-bl > nav { left: 0; }
.s334-dock.s334-br > nav, .s334-dock:not(.s334-bl):not(.s334-tl) > nav { right: 0; }
.s334-dock:not(.s334-bl):not(.s334-br) > nav { position: absolute; top: 100%; }
.s334-dock.s334-tl > nav { left: 0; right: auto; }
.s334-dock > nav a {
  display: block; padding: 5px 14px; margin: 0;
  color: #00ffe7; text-decoration: none; background: none; border: 0;
  font: inherit; letter-spacing: inherit;
}
.s334-dock > nav a::before { content: '▸ '; color: #ff2d78; }
.s334-dock > nav a:hover { color: #ffe600; background: rgba(255,45,120,.12); }
.s334-dock > nav a[aria-current="page"] { color: #ffe600; }
.s334-dock summary:focus-visible,
.s334-dock a:focus-visible { outline: 2px dashed #ffe600; outline-offset: 3px; }
@media print { .s334-dock { display: none; } }
