/* Top bar, three-column grid, panel and CRT screen chrome. */

/* top bar */
.topbar {
  display:flex;
  align-items:center;
  gap:20px;
  padding:8px 14px;
  border-bottom:2px solid var(--case-edge);
  flex-wrap:wrap;
  background:var(--case-2);
}
.logo {
  font-family:var(--px);
  font-size:14px;
  letter-spacing:1px;
  white-space:nowrap;
  color:var(--case-ink);
}
.logo b {
  color:var(--mag);
  font-weight:normal;
  margin:0 .45em;
  text-shadow:2px 2px 0 #000;
}
.stat {
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.stat small {
  font-size:15px;
  color:var(--case-dim);
}
.stat span {
  font-family:var(--px);
  font-size:11px;
  display:flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
}
.stat em {
  font-style:normal;
  font-size:15px;
  color:var(--case-dim);
  white-space:nowrap;
}
.sc {
  width:14px;
  height:14px;
  image-rendering:pixelated;
  vertical-align:middle;
}
.stat .copyable {
  cursor: pointer;
  border-bottom: 1px dotted var(--case-dim);
}
.stat .copyable:hover { color: var(--mag); }
.spacer { flex:1; }
.topbtns {
  display:flex;
  gap:6px;
}

/* grid */
.grid {
  flex:1;
  display:grid;
  grid-template-columns:minmax(240px,1fr) minmax(360px,2.1fr) minmax(280px,1.15fr);
  grid-template-rows:minmax(0,1fr);
  gap:10px;
  padding:10px;
  min-height:0;
}
.panel {
  background:var(--case-2);
  border:2px solid var(--case-edge);
  box-shadow:0 3px 0 var(--case-edge);
  display:flex;
  flex-direction:column;
  min-height:0;
  min-width:0;
  padding:8px;
  gap:8px;
}
.ptitle {
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-family:var(--px);
  font-size:10px;
  padding:2px 2px 0;
  color:var(--case-ink);
}
.ptitle .tag {
  color:var(--case-dim);
  font-size:9px;
}
.screen {
  background:var(--screen);
  border:2px solid #000;
  box-shadow:inset 0 0 0 2px var(--screen-line),inset 0 0 40px rgba(61,242,255,.05);
  color:var(--ink);
  position:relative;
  overflow:hidden;
}
.screen::after {
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:repeating-linear-gradient(to bottom,rgba(255,255,255,.028) 0 1px,transparent 1px 3px);
  z-index:3;
}