/* Gagik Navasardyan - personal page.
   Everything here is deliberate. If it is not doing work, it is not here. */

html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: Charter, "Bitstream Charter", "Sitka Text", Cambria, Georgia, serif;
  font-size: 18px;
  line-height: 1.58;
  color: #141414;
  background: #ffffff;
  max-width: 38rem;
  margin: 4rem auto 6rem;
  padding: 0 1.5rem;
}

/* ---- headings ---------------------------------------------------------- */

h1 {
  font-size: 1.75rem;
  font-weight: 700;
  font-variant: small-caps;
  letter-spacing: 0.03em;
  margin: 0 0 0.35rem;
}

h2 {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "DejaVu Sans Mono", monospace;
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: #141414;
  margin: 2.75rem 0 0.85rem;
  padding-bottom: 0.3rem;
  border-bottom: 1px solid #d8d8d2;
}

hr {
  border: 0;
  border-top: 1px solid #141414;
  margin: 1.25rem 0 1.75rem;
}

/* ---- text -------------------------------------------------------------- */

p {
  margin: 0 0 1.1rem;
}

.contact {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "DejaVu Sans Mono", monospace;
  font-size: 0.82rem;
  line-height: 1.9;
  margin: 0;
  color: #4a4a44;
}

a {
  color: #0000c8;
  text-decoration: underline;
  text-underline-offset: 0.14em;
}

/* Hold the blue after a visit. Stated explicitly rather than deleted, so the
   browser's own purple never gets a chance to apply. */
a:visited {
  color: #0000c8;
}

a:hover {
  background: #f0f0e8;
}

/* The address copies on click rather than launching a mail client. It keeps a
   real mailto: href so it still does something with JavaScript off. */
#email {
  cursor: copy;
}

code, kbd {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "DejaVu Sans Mono", monospace;
  font-size: 0.85em;
}

kbd {
  border: 1px solid #c9c9c2;
  border-bottom-width: 2px;
  padding: 0.05em 0.35em;
  background: #f7f7f4;
}

pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "DejaVu Sans Mono", monospace;
  font-size: 0.8rem;
  line-height: 1.65;
  background: #f7f7f4;
  border: 1px solid #dededa;
  padding: 0.9rem 1rem;
  margin: 0 0 1.1rem;
  overflow-x: auto;
}

pre code {
  font-size: inherit;
}

/* ---- bench table ------------------------------------------------------- */

dl {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "DejaVu Sans Mono", monospace;
  font-size: 0.8rem;
  line-height: 1.75;
  margin: 0 0 1.1rem;
}

dt {
  float: left;
  clear: left;
  width: 7rem;
  font-weight: 700;
}

dd {
  margin: 0 0 0.35rem 7rem;
  color: #333;
}

.colophon {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "DejaVu Sans Mono", monospace;
  font-size: 0.72rem;
  line-height: 1.8;
  color: #6b6b64;
  margin: 0;
}

/* ---- modal editor ------------------------------------------------------ */

.vim {
  border: 1px solid #141414;
  background: #ffffff;
  margin: 0 0 1.1rem;
  outline: none;
}

.vim-buffer {
  font-size: 0.8rem;
  line-height: 1.5;
  background: transparent;
  border: 0;
  margin: 0;
  padding: 0.6rem 0.7rem;
  white-space: pre-wrap;
  word-break: break-word;
  color: #141414;
  cursor: text;
}

.vim-tilde {
  color: #a8a8a0;
}

/* Painted, not typed. Same grey as the tildes so it reads as chrome rather
   than as something already sitting in the buffer. */
.vim-hint {
  color: #a8a8a0;
}

/* Block cursor. Solid when focused, hollow when not - same as the real thing. */
.vim-cur {
  background: #141414;
  color: #ffffff;
}

.vim:not(:focus) .vim-cur {
  background: transparent;
  color: #141414;
  box-shadow: inset 0 0 0 1px #141414;
}

.vim-status {
  display: flex;
  justify-content: space-between;
  /* Without this the label stretches to the bar's full height and sits at the
     top of it, while the send button centres its own text inside its padding.
     They only line up if both are centred. */
  align-items: center;
  gap: 1rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "DejaVu Sans Mono", monospace;
  font-size: 0.75rem;
  line-height: 1.7;
  background: #141414;
  color: #f4f4ee;
  padding: 0.15rem 0.7rem;
  white-space: pre;
  overflow: hidden;
}

#vim-left {
  overflow: hidden;
  text-overflow: ellipsis;
}

#vim-right {
  flex: none;
  color: #b4b4ac;
}

.vim-err {
  color: #ff8f7a;
}

.vim-ok {
  color: #9fe08f;
}

.vim-warn {
  color: #ffcf6b;
}

/* Touch fallback: no modal editing without a physical keyboard. */
.vim-plain {
  display: block;
  width: 100%;
  box-sizing: border-box;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "DejaVu Sans Mono", monospace;
  font-size: 0.85rem;
  line-height: 1.5;
  border: 0;
  padding: 0.6rem 0.7rem;
  min-height: 11em;
  resize: vertical;
  outline: none;
}

.vim-send {
  flex: none;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "DejaVu Sans Mono", monospace;
  font-size: 0.75rem;
  background: #141414;
  color: #f4f4ee;
  border: 0;
  padding: 0.35rem 0.9rem;
  cursor: pointer;
}

/* ---- narrow screens ---------------------------------------------------- */

@media (max-width: 34rem) {
  body {
    font-size: 17px;
    margin: 2.5rem auto 4rem;
  }
  dt {
    float: none;
    width: auto;
  }
  dd {
    margin-left: 0;
    margin-bottom: 0.7rem;
  }
}

/* ---- print ------------------------------------------------------------- */

@media print {
  body { max-width: none; margin: 0; }
  .vim, .vim-status { display: none; }
  a { color: #000; }
}
