@charset "utf-8";
/* ==========================================================================
   maeli.net OS   -   theme.css
   --------------------------------------------------------------------------
   Nur noch der VGA-Textmodus des Boots (BIOS, Kernel, Konsole) und die
   Grundlagen der Seite.

   Der Desktop liegt NICHT hier:
     system/system.css   - Fensterstruktur, Menues, Programme (WM-unabhaengig)
     wm/<id>/wm.css      - das Aussehen des jeweiligen Window Managers
   ========================================================================== */

:root{
  /* VGA-16-Farben, die echten von 1990 */
  --vga-bg:      #000000;
  --vga-grey:    #aaaaaa;
  --vga-dgrey:   #555555;
  --vga-bright:  #ffffff;
  --vga-cyan:    #00aaaa;
  --vga-bcyan:   #55ffff;
  --vga-green:   #00aa00;
  --vga-bgreen:  #55ff55;
  --vga-red:     #aa0000;
  --vga-bred:    #ff5555;
  --vga-brown:   #aa5500;
  --vga-byellow: #ffff55;

  --mono: "Courier New","Nimbus Mono PS","Liberation Mono",ui-monospace,monospace;
}

*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#000}
body{
  font-family:var(--mono);
  overflow:hidden;
  -webkit-tap-highlight-color:transparent;
  overscroll-behavior:none;
  color:var(--vga-grey);
}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ------------------------------------------------------ Boot-Bildschirm */
#crt{
  position:fixed;inset:0;background:var(--vga-bg);
  padding:1.2vmin 1.4vmin;
  font-size:min(calc(100vh / 27), calc(100vw / 86));
  line-height:1.06;
  text-shadow:0 0 1px rgba(170,170,170,.35);
  transition:opacity .25s linear;
  z-index:100;
}
@media (max-width:560px){ #crt{font-size:min(calc(100vh / 28), calc(100vw / 44))} }

#screen{height:100%;overflow:hidden}
#lines{white-space:pre-wrap;word-break:break-word}
#lines div{min-height:1.06em}

.c-post{color:var(--vga-grey)}
.c-bright{color:var(--vga-bright)}
.c-dim{color:var(--vga-dgrey)}
.c-cyan{color:var(--vga-cyan)}
.c-green{color:var(--vga-green)}
.c-bgreen{color:var(--vga-bgreen)}
.c-yellow{color:var(--vga-byellow)}
.c-red{color:var(--vga-bred)}
.c-brown{color:var(--vga-brown)}

.cursor{display:inline-block;width:1ch;height:1em;vertical-align:-.14em;
  background:var(--vga-grey);animation:blink 1.06s steps(1,end) infinite}
@keyframes blink{0%,50%{opacity:1}50.01%,100%{opacity:0}}
@media (prefers-reduced-motion:reduce){ .cursor{animation:none} #crt{transition:none} }

/* ENERGY-Logo im BIOS-Bildschirm (siehe boot/boot.js) */
#energy{
  position:absolute;top:2.4vmin;right:3vmin;line-height:0;
  filter:drop-shadow(0 0 2px rgba(85,255,85,.35));
}
#energy svg{display:block;width:clamp(104px,17vmin,180px);height:auto}
@media (max-width:520px){ #energy svg{width:88px} }
#skip{position:fixed;right:1.6vmin;bottom:.8vmin;color:var(--vga-dgrey);
  font-size:min(1.5vh,2.4vw);letter-spacing:.08em;z-index:101}
#skip[hidden]{display:none}

#loginInput{position:fixed;top:0;left:0;width:1px;height:1px;padding:0;border:0;
  background:transparent;color:transparent;opacity:0;outline:none}