:root {
  color-scheme: dark;
  --background: #101112;
  --surface: #17191b;
  --surface-hover: #1d2023;
  --foreground: #f2f1ed;
  --muted: #929399;
  --line: #303236;
  --gold: #b77d18;
  --pink: #ec5d9b;
  --focus: #62d7e4;
  --error: #ff9898;
  --mono: ui-monospace, "SFMono-Regular", "Cascadia Code", "Roboto Mono", monospace;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}



* { box-sizing: border-box; }
html { main-height: 100%; background: var(--background); }
body { msin-height: 100%; margin: 0; 
  background: radial-gradient(circle at 50% 4%, rgb(183 125 24 / 15%), transparent 19rem), var(--background); 
  background-attachment: fixed;
  color: var(--foreground); font: inherit; line-height: 1.45; }
.page { 
  padding: 1rem;
  /* //width: min(100% - 2rem, 21rem);  */
  max-width: 40rem;
  margin: 0 auto; 
}
.identity { text-align: center; }
.profile-mark { display: grid; width: 8.7rem; height: 8.7rem; margin: 0 auto 1.35rem; border: 2px solid var(--gold); border-radius: 50%; box-shadow: 0 0 0 .18rem var(--background), 0 0 2.5rem rgb(183 125 24 / 20%); place-items: center; color: var(--foreground); font-size: 1.8rem; font-weight: 500; letter-spacing: -.04em; }
.eyebrow { margin: 0; color: var(--muted); font: .65rem/1.5 var(--mono); letter-spacing: .22em; text-transform: uppercase; }
h1 { margin: .8rem 0 0; font-size: clamp(2rem, 9vw, 2.45rem); font-weight: 900; letter-spacing: -.065em; line-height: 1.03; }
.descriptor { max-width: 17rem; margin: .9rem auto 0; color: var(--muted); font-size: 1rem; line-height: 1.6; }
.command-list, .quick-actions { margin: 0; padding: 0; list-style: none; }
.contact-actions { margin-top: 2rem; }
.command-link { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; min-height: 3rem; border: 1px solid var(--line); border-radius: .5rem; color: var(--foreground); font-size: .88rem; font-weight: 500; text-decoration: none; transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease; }
.icon { display: block; width: 1.1rem; height: 1.1rem; }
.command-link--primary { background: var(--foreground); border-color: var(--foreground); color: var(--background); font-size: .9rem; font-weight: 700; border-radius: 2rem;}
.command-link--primary .icon { margin-right: .55rem; }
.link-protocol { color: inherit; font: .58rem var(--mono); font-weight: 400; letter-spacing: .04em; opacity: .52; }
.command-link--primary .link-protocol { position: absolute; right: 1rem; }
.command-link--primary:hover { background: #ffffff; }
.quick-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45rem; margin-top: .75rem; }
.command-link--quiet { min-height: 2.5rem; gap: .3rem; padding: .35rem; border-radius: 2rem; background: transparent; color: var(--foreground); font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.command-link--quiet .icon { width: .85rem; height: .85rem; }
.command-link--quiet .link-protocol { position: absolute; right: .55rem; font-size: .46rem; letter-spacing: 0; opacity: .42; }
.command-link--quiet:hover { border-color: #505359; background: var(--surface); }
/* .command-link--quiet[href^="mailto"] { font-size: 0; } */
/* .command-link--quiet[href^="mailto"]::before { content: "Email"; font-size: .7rem; } */
/* .command-link--quiet[href^="tel"] { font-size: 0; } */
/* .command-link--quiet[href^="tel"]::before { content: "Call"; font-size: .7rem; } */
/* .command-link--quiet[href^="https://lenda"] { font-size: 0; } */
/* .command-link--quiet[href^="https://lenda"]::before { content: "lenda.dk"; font-size: .7rem; } */
.social-actions { display: grid; gap: .65rem; margin-top: 2.55rem; padding-top: 2.2rem; border-top: 1px solid var(--line); position: relative; }

.social-link { display: flex; align-items: center; min-height: 4.65rem; padding: .7rem .8rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--surface); color: var(--foreground); text-align: left; text-decoration: none; transition: background-color 160ms ease, border-color 160ms ease; }
.social-link:hover { border-color: #45484e; background: var(--surface-hover); }
.social-icon { display: grid; width: 2.65rem; height: 2.65rem; flex: 0 0 auto; border-radius: .7rem; background: #202326; color: var(--foreground); place-items: center; }
.social-icon .icon { width: 1.2rem; height: 1.2rem; }
.social-copy { display: grid; min-width: 0; margin-left: .8rem; gap: .1rem; }
.social-copy strong { font-size: .9rem; font-weight: 600; }
.social-copy small { overflow: hidden; color: var(--muted); font: .67rem var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.social-arrow { margin-left: auto; color: var(--muted); font-size: 1.25rem; }
.terminal-note { margin: 2.35rem 0 0; color: var(--muted); font: .66rem var(--mono); white-space: nowrap; }
.terminal-note span { color: var(--pink); }
.terminal-note b { color: var(--gold); font-weight: 500; }
a:focus-visible, button:focus-visible, input:focus-visible, .return-button:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.command-shell { position: fixed; z-index: 1; right: 0; bottom: 0; left: 0; padding: .65rem 1rem max(.85rem, env(safe-area-inset-bottom)); border-top: 1px solid #202226; background: #090a0b; box-shadow: 0 -1rem 2.5rem rgb(0 0 0 / 40%); }
.command-inner { width: 100%; color: var(--foreground); }
.command-error { min-height: 1.2em; margin: 0 0 .35rem; color: var(--error); font: .72rem var(--mono); }
.scommand-form { display: flex; align-items: center; width: 100%; min-height: 3rem; border: 1px solid var(--line); border-radius: .5rem; background: #111315; }
.command-prompt { padding: 0 .7rem 0 .9rem; color: var(--pink); font-family: var(--mono); user-select: none; }
//input { width: 100%; min-width: 0; height: 2.9rem; padding-right: .9rem; border: 0; outline: 0; background: transparent; color: var(--foreground); font: .85rem var(--mono); }
//input::placeholder { color: #73767d; opacity: 1; }
.output { text-align: left; }
.output h1 { margin-bottom: 1rem; font-size: 2rem; }
.output pre { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; color: var(--foreground); font: .85rem/1.7 var(--mono); }
.return-button { margin-top: 2rem; padding: .65rem .85rem; border: 1px solid var(--line); border-radius: .5rem; background: transparent; color: var(--foreground); cursor: pointer; font: .78rem var(--mono); }
.return-button:hover { background: var(--surface); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
@media (min-width: 42rem) { .page { padding-top: 3rem; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: 0ms !important; } }

.command-form {
  position: fixed;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
width: 100%;
}
.command-form input {
    font-family: "Special Gothic Condensed One", sans-serif;

  text-transform: uppercase;
  width: 100%;
  padding: 1rem;
  border: none;
  outline: none;
  background-color: transparent;
  color: var(--foreground);
  font-size: 1rem;
  font-weight: 900;
}