/* Haneda's flights as a split-flap board (flapboard.js): cream characters on
   dark flaps, each split by the hinge, in columns under small headings. */
.flapboard {
  background: #141414;
  color: #f3ead0;
  border-radius: 12px;
  padding: 12px 14px 14px;
  margin-bottom: 12px;
  box-shadow:
    inset 0 0 0 1px #000,
    0 2px 10px rgb(0 0 0 / 0.25);
  font-family: "SF Mono", ui-monospace, Menlo, Consolas, "Courier New", monospace;
  font-weight: 600;
  overflow: hidden;
  user-select: none;
}
.flapboard .fb-top {
  display: flex;
  align-items: center;
  gap: 0.6em;
  margin-bottom: 0.5em;
  cursor: pointer;
}
.flapboard .fb-title {
  font-size: 1.35em;
}
.flapboard .fb-ja {
  color: #b9b09a;
  font-size: 0.95em;
  font-family: system-ui, "Hiragino Sans", "Noto Sans JP", sans-serif;
}
.flapboard .fb-where {
  margin-left: auto;
  color: #8f8878;
  font-size: 0.8em;
  font-family: system-ui, sans-serif;
  font-weight: 500;
  text-align: right;
}
.flapboard .fb-clock {
  font-size: 1.1em;
}
.flapboard .fb-heads,
.flapboard .fb-row {
  display: flex;
  gap: 0.5em;
  white-space: nowrap;
}
.flapboard .fb-heads small {
  color: #8f8878;
  font:
    500 0.62em/1.6 system-ui,
    sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.flapboard .fb-heads span {
  flex: none;
  overflow: hidden;
}
.flapboard .fb-row {
  margin-top: 0.22em;
}
.flapboard .fb-field {
  display: flex;
  flex: none;
}
.flapboard .fb-cell {
  position: relative;
  display: inline-block;
  width: 1.02em;
  height: 1.5em;
  margin-right: 0.1em;
  line-height: 1.5em;
  text-align: center;
  border-radius: 0.14em;
  background: linear-gradient(#2b2b2b 0 49%, #050505 49% 53%, #222 53%);
  box-shadow: inset 0 -1px 0 rgb(255 255 255 / 0.04);
  transform-origin: 50% 50%;
}
.flapboard .fb-cell::after {
  /* The hinge, over the character too. */
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 49%;
  height: 0.08em;
  background: rgb(0 0 0 / 0.7);
}
.flapboard .tone-go {
  color: #8ff0a4;
}
.flapboard .tone-warn {
  color: #ffc94a;
}
.flapboard .tone-done {
  color: #8f8878;
}
.flapboard .fb-note {
  margin-top: 0.6em;
  color: #8f8878;
  font:
    500 0.7em system-ui,
    sans-serif;
}
