:root{
  --bg:#0A0A0A;
  --text:#E5E5E5;
  --muted:#9a9a9a;
  --green:#77A36F;   /* vibrant gum green */
  --footer-h:70px;   /* reduced for tighter layout */
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  line-height:1.7;
}

/* layout */
.container{
  max-width:700px;
  margin:64px auto;
  padding:0 16px;
  padding-bottom: calc(var(--footer-h) + 40px); /* reduced spacing */
}

/* headings & dividers */
h2{
  color:var(--green);
  font-weight:600;
  margin:40px 0 8px;
  letter-spacing:0.2px;
}
.divider{
  border:none;
  border-top:1px solid var(--green);
  margin:10px 0 8px;
}
.dash{
  color:var(--green);
  letter-spacing:2px;
  margin-bottom:18px;
}

/* console blocks */
.boot{
  color:var(--green);
  white-space:pre-wrap;
  background:rgba(119,163,111,0.08);
  border-left:3px solid var(--green);
  padding:12px 12px 12px 14px;
  border-radius:4px;
  margin:24px 0;
}
.boot.end{
  margin-top:28px;
  background:transparent;
  border-left-color:rgba(119,163,111,0.5);
}

/* blinking cursor */
.cursor{
  animation:blink 1.1s steps(1) infinite;
}
@keyframes blink{
  50%{opacity:0;}
}

/* footer */
.footer{
  position:fixed;
  left:0; right:0; bottom:0;
  background:linear-gradient(180deg, rgba(10,10,10,0) 0%, rgba(10,10,10,0.95) 30%, rgba(10,10,10,1) 100%);
  text-align:center;
  padding:12px 10px 20px; /* more breathing space at bottom */
  font-size:12.5px;
  color:var(--muted);
  backdrop-filter:saturate(120%) blur(2px);
  border-top:1px solid rgba(119,163,111,0.35);
  z-index:2;
}

/* action buttons (fixed bottom-right) */
.actions{
  position:fixed;
  right:16px;
  bottom: calc(var(--footer-h) + 8px);
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  z-index:3;
}
.btn{
  text-decoration:none;
  padding:8px 12px;
  border:1px solid var(--muted);
  color:var(--text);
  font-size:13px;
  border-radius:6px;
  transition:opacity .18s ease, border-color .18s ease;
  opacity:0.9;
}
.btn:hover{opacity:1}
.btn-gray{border-color:var(--muted); color:var(--muted)}
.btn-green{border-color:var(--green); color:var(--green)}

/* mobile adjustments */
@media (max-width:640px){
  .footer{
    position:static;
    background:none;
    border-top:1px solid rgba(119,163,111,0.35);
    padding:14px 10px 32px; /* extra space for buttons */
  }
  .container{
    padding-bottom:90px; /* tighter base padding */
  }
  .actions{
    right:12px;
    bottom: calc(env(safe-area-inset-bottom, 0px) + 16px);
    gap:8px;
  }
}