/* Earth terminal: a monochrome floating terminal window over the landing globe. */
.earth-terminal{
  --window-w:clamp(280px,24vw,340px);
  --window-h:clamp(190px,24vh,230px);
  --et-ink:#f1f1f1;
  --et-dim:rgb(255 255 255 / 54%);
  --et-faint:rgb(255 255 255 / 24%);
  --et-strong:#fff;
  --et-edge:rgb(255 255 255 / 22%);
  --et-line:rgb(255 255 255 / 8%);
  --et-surface:linear-gradient(145deg,rgb(255 255 255 / 5.5%),transparent 36%),linear-gradient(180deg,rgb(11 11 11 / 95%),rgb(23 23 23 / 91%));
  --et-shadow:0 16px 44px rgb(0 0 0 / 48%);
  position:fixed;
  left:calc(100% - var(--window-w) - 24px);
  top:calc(100% - var(--window-h) - 112px);
  width:var(--window-w);
  height:var(--window-h);
  z-index:6;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .45s ease,visibility .45s ease;
}
.earth-terminal.is-available{opacity:1;visibility:visible;pointer-events:auto}
.earth-terminal.is-minimized{opacity:0;visibility:hidden;pointer-events:none}
.earth-terminal *,.earth-terminal *::before,.earth-terminal *::after{box-sizing:border-box}

.earth-terminal-pod{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  color:var(--et-ink);
  background:var(--et-surface);
  border:1px solid var(--et-edge);
  border-radius:8px;
  box-shadow:var(--et-shadow);
  -webkit-backdrop-filter:blur(14px) saturate(20%);
  backdrop-filter:blur(14px) saturate(20%);
  font-family:"Cascadia Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace;
  opacity:0;
  transform:scale(.12);
  transform-origin:6% 100%;
  pointer-events:auto;
}
.earth-terminal.is-grown .earth-terminal-pod{animation:et-pod-grow .95s cubic-bezier(.16,1,.3,1) .08s both}
.earth-terminal-pod::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background-image:linear-gradient(var(--et-line) 1px,transparent 1px),linear-gradient(90deg,var(--et-line) 1px,transparent 1px);
  background-size:22px 22px;
  opacity:.15;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent);
  mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent);
  pointer-events:none;
}
.earth-terminal-pod::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:linear-gradient(180deg,rgb(255 255 255 / 6%),transparent 38%);
  pointer-events:none;
}
.earth-terminal.is-dragging .earth-terminal-bar{cursor:grabbing}
.earth-terminal.is-resizing .earth-terminal-pod{border-color:var(--et-edge)}
.earth-terminal .resize-se::after{
  content:"";
  position:absolute;
  right:5px;
  bottom:5px;
  width:6px;
  height:6px;
  border-right:1px solid var(--et-faint);
  border-bottom:1px solid var(--et-faint);
  pointer-events:none;
}

.earth-terminal-bar{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:8px;
  height:27px;
  padding:0 12px;
  border-bottom:1px solid var(--et-line);
  color:var(--et-dim);
  font-size:8px;
  letter-spacing:.16em;
  white-space:nowrap;
  cursor:grab;
  user-select:none;
}
.earth-terminal-bar:focus-visible{outline:1px solid var(--et-edge);outline-offset:-3px;border-radius:8px 8px 0 0}
.earth-terminal-close{
  display:grid;
  flex:0 0 auto;
  place-items:center;
  width:13px;
  height:13px;
  margin-left:6px;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--et-dim);
  cursor:pointer;
}
.earth-terminal-close span{color:inherit;font:400 16px/1 Arial,sans-serif}
.earth-terminal-close:hover{filter:brightness(1.12)}
.earth-terminal-close:focus-visible{outline:1px solid var(--et-ink);outline-offset:2px}
.earth-terminal-status{display:flex;align-items:center;gap:6px;color:var(--et-ink);min-width:0;overflow:hidden;text-overflow:ellipsis}
.earth-terminal-status i{flex:0 0 auto;width:5px;height:5px;border-radius:50%;background:var(--et-strong);opacity:.7}
.earth-terminal-code{margin-left:auto;color:var(--et-faint);font-size:7px;flex:0 0 auto}

.earth-terminal-screen{
  position:relative;
  z-index:2;
  display:flex;
  flex:1;
  flex-direction:column;
  min-height:0;
  gap:5px;
  padding:9px 12px 7px;
}
.earth-terminal-log{
  flex:1;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
  font-size:10.5px;
  line-height:1.7;
  scrollbar-width:thin;
  scrollbar-color:var(--et-faint) transparent;
}
.earth-terminal-log::-webkit-scrollbar{width:4px}
.earth-terminal-log::-webkit-scrollbar-thumb{background:var(--et-faint);border-radius:4px}
.earth-terminal-echo{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;color:var(--et-ink);white-space:pre-wrap;overflow-wrap:anywhere}
.earth-terminal-echo--user{margin-top:3px;color:var(--et-dim)}
.earth-terminal-prompt{color:var(--et-strong);font-weight:500;flex:0 0 auto}
.earth-terminal-caret{
  display:inline-block;
  flex:0 0 auto;
  width:6px;
  height:12px;
  margin-left:1px;
  background:var(--et-strong);
  animation:et-caret 1s steps(1) infinite;
}
.earth-terminal.is-ready .earth-terminal-caret{display:none}
.earth-terminal-open{
  display:inline-flex;
  align-items:center;
  min-width:0;
  color:inherit;
  text-decoration:none;
  border-radius:2px;
  white-space:nowrap;
  pointer-events:none;
}
.earth-terminal.is-ready .earth-terminal-open{pointer-events:auto;cursor:pointer}
.earth-terminal-open [data-terminal-type]{text-decoration:none;text-underline-offset:2px}
.earth-terminal-open:hover [data-terminal-type],.earth-terminal-open:focus-visible [data-terminal-type]{text-decoration:underline}
.earth-terminal-open:focus-visible{outline:1px solid var(--et-edge);outline-offset:2px}
.earth-terminal-arrow{
  display:inline-block;
  flex:0 0 auto;
  width:0;
  overflow:hidden;
  color:var(--et-ink);
  font-size:12px;
  opacity:0;
  transform:translateX(-2px);
  transition:opacity .18s ease,transform .18s ease,width .18s ease,margin .18s ease;
}
.earth-terminal.is-ready .earth-terminal-arrow{width:9px;margin-right:6px;opacity:.78;transform:none}
.earth-terminal-pod:hover .earth-terminal-arrow{opacity:1;transform:translateX(2px)}
.earth-terminal-response{margin:3px 0 0;color:var(--et-dim);font-size:9.5px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
.earth-terminal-response strong{color:var(--et-ink);font-weight:500}

.earth-terminal-form{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
  margin-top:auto;
  padding-top:6px;
  border-top:1px solid var(--et-line);
  color:var(--et-ink);
  font-size:10.5px;
}
.earth-terminal-form[hidden]{display:none}
.earth-terminal-form input{
  flex:1;
  min-width:0;
  border:0;
  outline:0;
  padding:2px 0;
  background:none;
  color:var(--et-ink);
  font:inherit;
  caret-color:var(--et-strong);
}
.earth-terminal-form input::placeholder{color:var(--et-faint)}
.earth-terminal-form button{
  display:grid;
  flex:0 0 auto;
  place-items:center;
  width:20px;
  height:18px;
  padding:0;
  border:1px solid var(--et-line);
  border-radius:3px;
  background:none;
  color:var(--et-strong);
  font:inherit;
  cursor:pointer;
}
.earth-terminal-form:focus-within{border-top-color:var(--et-edge)}
.earth-terminal-form:focus-within button{border-color:var(--et-edge)}
.earth-terminal-form button:hover{border-color:var(--et-strong);background:rgb(255 255 255 / 5%)}
.earth-terminal.is-focused .earth-terminal-pod{box-shadow:var(--et-shadow),inset 0 0 0 1px var(--et-line)}
.earth-terminal-foot{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  gap:8px;
  padding:0 12px 8px;
  color:var(--et-faint);
  font-size:7px;
  letter-spacing:.16em;
  white-space:nowrap;
}

/* The archive belongs to the scene; commands are a secondary action. */
.earth-archive{
  --archive-radius:min(118px,23vw,14.5vh);
  position:fixed;
  left:calc(50% + var(--archive-radius) + 96px);
  top:calc(52% - 43px);
  z-index:5;
  width:216px;
  color:var(--foreground);
  font-family:"Cascadia Mono","SFMono-Regular",Consolas,monospace;
}
.earth-archive[hidden]{display:none}
.earth-archive-leader{
  position:absolute;
  top:13px;
  right:calc(100% + 14px);
  width:68px;
  height:1px;
  background:currentColor;
  opacity:.3;
  pointer-events:none;
  transition:opacity .25s ease;
}
.earth-archive-leader::before{
  content:"";
  position:absolute;
  left:0;
  top:-2px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:currentColor;
}
.earth-archive-link{
  display:inline-flex;
  align-items:center;
  gap:12px;
  min-height:28px;
  color:inherit;
  text-decoration:none;
  font-size:12px;
  font-weight:400;
  letter-spacing:.1em;
}
.earth-archive-title{animation:archive-type .85s steps(16,end) both}
.earth-archive-title::after{content:"";display:inline-block;width:1px;height:10px;margin-left:4px;background:currentColor;animation:archive-caret .7s step-end 3 forwards}
.earth-archive-arrow{font:16px/1 Arial,sans-serif;opacity:.55;transition:transform .2s,opacity .2s}
.earth-archive-link:hover .earth-archive-arrow{transform:translate(2px,-2px);opacity:1}
.earth-archive-link:hover .earth-archive-title{text-decoration:underline;text-underline-offset:5px}
.earth-archive-meta{display:flex;align-items:center;gap:16px;margin-top:3px;font-size:9px;letter-spacing:.06em}
.earth-archive-meta>span{opacity:.5}
.earth-terminal-launcher{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:28px;
  padding:0 2px;
  border:0;
  background:none;
  color:inherit;
  opacity:.6;
  font:inherit;
  cursor:pointer;
  transition:opacity .18s ease;
}
.earth-terminal-launcher:hover,.earth-terminal-launcher[aria-expanded="true"]{opacity:1}
.earth-archive-link:focus-visible,.earth-terminal-launcher:focus-visible{outline:1px solid var(--focus-ring);outline-offset:4px}
@keyframes archive-caret{0%,45%{opacity:.65}46%,100%{opacity:0}}
@keyframes archive-type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}

@keyframes et-pod-grow{
  0%{opacity:0;transform:scale(.12);filter:blur(4px)}
  42%{opacity:1}
  100%{opacity:1;transform:scale(1);filter:blur(0)}
}
@keyframes et-caret{0%,48%{opacity:1}49%,100%{opacity:0}}

:root[data-theme="light"] .earth-terminal{
  --et-ink:#141414;
  --et-dim:rgb(20 20 20 / 58%);
  --et-faint:rgb(20 20 20 / 28%);
  --et-strong:#111;
  --et-edge:rgb(20 20 20 / 20%);
  --et-line:rgb(20 20 20 / 8%);
  --et-surface:linear-gradient(145deg,rgb(255 255 255 / 82%),transparent 36%),linear-gradient(180deg,rgb(250 250 250 / 96%),rgb(236 236 236 / 92%));
  --et-shadow:0 16px 40px rgb(20 20 20 / 12%);
}
:root[data-theme="light"] .earth-terminal-pod::after{background:linear-gradient(180deg,rgb(255 255 255 / 40%),transparent 38%)}
:root[data-theme="light"] .earth-terminal-form button:hover{background:rgb(20 20 20 / 5%)}

@media(max-width:960px){
  .earth-terminal{
    --window-w:min(520px,calc(100vw - 32px));
    --window-h:clamp(180px,23vh,190px);
    left:calc(100% - var(--window-w) - 16px);
    top:calc(100% - var(--window-h) - 112px);
    width:var(--window-w);
    height:var(--window-h);
  }
  .earth-terminal-pod{width:100%}
  .earth-terminal-bar{height:24px;padding:0 10px;font-size:7px}
  .earth-terminal-screen{padding:7px 10px 6px}
  .earth-terminal-log{font-size:10px}
  .earth-terminal-response{font-size:9px}
  .earth-terminal-form{font-size:10px}
  .earth-terminal-foot{padding:0 10px 6px;font-size:6.5px}
}
@media(max-width:1280px){
  .earth-archive{left:calc(50% - 108px);top:min(calc(52% + var(--archive-radius) + 32px),calc(100% - 180px));text-align:center}
  .earth-archive-meta{justify-content:center}
  .earth-archive-leader{width:1px;height:20px;top:-26px;right:50%}
  .earth-archive-leader::before{left:-2px}
  .earth-terminal-launcher{min-height:36px}
}
@media(max-height:600px) and (min-width:650px){
  .earth-archive{left:auto;right:24px;top:36%;text-align:left}
  .earth-archive-meta{justify-content:flex-start}
  .earth-archive-leader{display:none}
}
@media(max-height:600px) and (max-width:649px){
  .earth-archive{top:auto;bottom:110px}
  .earth-archive-leader{display:none}
}

@media(prefers-reduced-motion:reduce){
  .earth-terminal{transition:none}
  .earth-archive-title{animation:none}
  .earth-archive-title::after{animation:none;opacity:0}
  .earth-archive-arrow,.earth-archive-leader{transition:none}
  .earth-terminal.is-grown .earth-terminal-pod{animation:none;opacity:1;transform:none;filter:none}
  .earth-terminal-caret{animation:none}
  .earth-terminal.is-ready .earth-terminal-caret{display:none}
  .earth-terminal-arrow{transition:none}
}