:root {
  --win95-gray: #c0c0c0;
  --win95-dark: #808080;
  --win95-darker: #404040;
  --win95-light: #ffffff;
  --win95-blue: #000080;
  --win95-text: #000000;
  --win95-highlight: #000080;
  --win95-highlight-text: #ffffff;
  --desktop-teal: #008080;
  --font-main: 'Share Tech Mono', 'Courier New', monospace;
  --font-pixel: 'VT323', monospace;
  --font-retro: 'VT323', monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--font-main); font-size: 12px; overflow: hidden; background: #000; }

.crt-screen {
  position: fixed; inset: 0;
  background: var(--desktop-teal);
  overflow: hidden;
  box-shadow: inset 0 0 80px rgba(0,0,0,0.4), 0 0 0 3px #111, 0 0 30px rgba(0,0,0,0.8);
}
.crt-screen::before {
  content: '';
  position: absolute; inset: 0; z-index: 9999;
  background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.03) 2px, rgba(0,0,0,0.03) 4px);
  pointer-events: none;
}

::-webkit-scrollbar { width: 16px; height: 16px; }
::-webkit-scrollbar-track { background: var(--win95-gray); border: 1px solid var(--win95-dark); }
::-webkit-scrollbar-thumb { background: var(--win95-gray); border-top: 2px solid #fff; border-left: 2px solid #fff; border-right: 2px solid var(--win95-darker); border-bottom: 2px solid var(--win95-darker); }

.win-btn {
  background: var(--win95-gray);
  border-top: 2px solid #fff;
  border-left: 2px solid #fff;
  border-right: 2px solid var(--win95-darker);
  border-bottom: 2px solid var(--win95-darker);
  font-family: var(--font-main);
  font-size: 11px;
  color: #000;
  padding: 3px 12px;
  cursor: pointer;
  min-width: 75px;
}
.win-btn:active {
  border-top: 2px solid var(--win95-darker);
  border-left: 2px solid var(--win95-darker);
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
}
.win-btn-primary {
  background: var(--win95-gray);
  border: 2px solid #000;
  outline: 1px solid var(--win95-dark);
  font-family: var(--font-main);
  font-size: 11px;
  padding: 4px 14px;
  cursor: pointer;
}

/* Screen management */
.screen {
  position: absolute;
  inset: 0;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.screen.active {
  display: flex;
}

/* Animations */
@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes scaleIn {
  from { transform: scale(0.95); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}
@keyframes screenFlicker {
  0%   { opacity: 1; }
  10%  { opacity: 0.3; }
  20%  { opacity: 1; }
  40%  { opacity: 0.7; }
  50%  { opacity: 1; }
  60%  { opacity: 0.4; }
  80%  { opacity: 1; }
  90%  { opacity: 0.6; }
  100% { opacity: 1; }
}

/* Mobile base */
@media (max-width: 768px) {
  body { font-size: 11px; }
}

/* ── Shared page taskbar (MPA pages) ─────────────────────────── */
#sharedTaskbar {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  height: 40px;
  background: #c0c0c0;
  border-top: 2px solid #ffffff;
  box-shadow: inset 0 1px 0 #ffffff;
  display: flex;
  align-items: center;
  padding: 0 4px;
  gap: 4px;
  z-index: 9000;
  user-select: none;
  font-family: var(--font-main, 'Share Tech Mono', monospace);
}
#sharedClock {
  font-family: var(--font-main, 'Share Tech Mono', monospace);
  font-size: 11px;
  color: #000;
  padding: 3px 8px;
  border-top: 1px solid #808080;
  border-left: 1px solid #808080;
  border-right: 1px solid #ffffff;
  border-bottom: 1px solid #ffffff;
  background: #c0c0c0;
  white-space: nowrap;
  flex-shrink: 0;
  margin-left: auto;
}
.taskbar-nav-btn {
  font-family: var(--font-main, 'Share Tech Mono', monospace);
  font-size: 11px;
  padding: 3px 8px;
  cursor: pointer;
  background: #c0c0c0;
  border-top: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
  border-right: 2px solid #404040;
  border-bottom: 2px solid #404040;
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.taskbar-nav-btn:active {
  border-top: 2px solid #404040;
  border-left: 2px solid #404040;
  border-right: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;
  padding: 4px 7px 2px 9px;
}
.home-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
  vertical-align: middle;
}
.taskbar-divider {
  width: 2px;
  height: 28px;
  border-left: 1px solid #808080;
  border-right: 1px solid #ffffff;
  flex-shrink: 0;
}
#sharedTaskbarApps {
  display: flex;
  gap: 2px;
  flex: 1;
  overflow: hidden;
}
.taskbar-btn {
  font-family: var(--font-main, 'Share Tech Mono', monospace);
  font-size: 11px;
  padding: 3px 10px;
  cursor: pointer;
  background: #c0c0c0;
  border-top: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
  border-right: 2px solid #404040;
  border-bottom: 2px solid #404040;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 200px;
}
.taskbar-btn.active {
  border-top: 2px solid #404040;
  border-left: 2px solid #404040;
  border-right: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;
  background: #b0b0b0;
  padding: 4px 9px 2px 11px;
}