@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600&family=Caveat:wght@500;600;700&family=Courier+Prime:wght@400;700&family=Crimson+Pro:ital,wght@0,400;0,500;1,400&family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@300;400;500;600&display=swap');

@keyframes tk-blink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }

/* torchlight wash (element sits at top of the page body) */
.tk-torch {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(56% 42% at 82% 4%,
    rgba(6, 198, 202, 0.15), rgba(0, 157, 160, 0.03) 52%, transparent 70%);
}

.tk-wrap {
  position: relative;
  z-index: 1;
  max-width: 820px;
  margin: 0 auto;
  padding: 8px 6px 60px;
  font-family: 'Barlow', sans-serif;
}

/* console breadcrumb */
.tk-crumb {
  margin-bottom: 18px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  color: #b9c4c2;
}
.tk-crumb .p   { color: grey; font-weight: 600; }
.tk-crumb .s   { color: #ffbf00; }
.tk-crumb .b   { color: #8b877e; }
.tk-crumb .car { color: #009DA0; animation: tk-blink 1.1s step-end infinite; }

/* title block */
.tk-kicker {
  margin-bottom: 10px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #009DA0;
  text-align: right;
}
.tk-title {
  margin: 0 0 14px;
  font-family: 'BitCount', serif !important;
  font-weight: 300;
  font-size: clamp(33px, 6vw, 55px);
  line-height: 1;
  color: #ffbf00 !important;
  text-align: center;
}
.tk-sub {
  /* max-width: 60ch; */
  margin: 0 0 18px;
  font-family: 'Barlow', serif;
  font-size: 20px;
  line-height: 1.35;
  color: #c1d1ce;
  text-align: center;
}
.tk-sub .g { color: #ffbf00; }

/* author · venue */
.tk-meta {
  display: block;
  /* display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px; */
  margin-bottom: 18px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12.5px;
  color: #8fa09e;
  text-align: center;
}
.tk-meta .name  { color: #c6d5d2; }
.tk-meta .sep   { color: #3a4443; }
.tk-meta .venue { font-family: 'Crimson Pro', serif; font-style: italic; font-size: 15px; color: #9fb4b1; }

/* categories — handwritten line */
.tk-cats {
  display: block;
  /* display: flex;
  flex-wrap: wrap;
  gap: 0 10px; */
  margin-bottom: 26px;
  font-family: 'Caveat', cursive;
  font-size: 20px;
  text-align: right;
}
.tk-cats span { color: #009DA0; }
.tk-cats span:not(:last-child)::after {
  content: '\00a0 · \00a0'; color: #4d5b5a; }

/* action buttons */
.tk-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 34px; }
.tk-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 18px;
  border-radius: 6px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  text-decoration: none !important;
  transition: all 0.15s ease;
}
.tk-btn.primary {
  color: #0e0f0f !important;
  background: #009DA0;
  border: 1px solid #009DA0;
  font-weight: 500;
}
.tk-btn.primary:hover { background: #ffbf00; border-color: #ffbf00; color: #0e0f0f !important; }
.tk-btn.ghost {
  color: #06c6ca !important;
  background: transparent;
  border: 1px solid #2f4b4b;
}
.tk-btn.ghost:hover { border-color: #009DA0; background: rgba(0, 157, 160, 0.08); color: #06c6ca !important; }

.tk-rule { margin: 0 0 30px; border: none; border-top: 1.5px dashed #2f4744; }

/* section headings */
.tk-h {
  margin: 0 0 12px;
  font-family: 'Caveat', cursive;
  font-size: 26px;
  color: #ffbf00;
}
.tk-h .tag {
  margin-left: 14px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.1em;
  color: #6b7c7b;
}

/* abstract / prose */
.tk-prose {
  /* max-width: 66ch; */
  margin: 0 0 38px;
  font-family: 'Barlow', sans-serif;
  font-size: 16.5px;
  line-height: 1.6;
  color: #c6d5d2;
  text-align: justify;
}
.tk-prose code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  color: #06c6ca;
  background: none;
  padding: 0;
}

/* slides in a terminal frame */
.tk-frame {
  margin-bottom: 38px;
  overflow: hidden;
  background: #0d0e0e;
  border: 1px solid #2a2b2b;
  border-radius: 10px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}
.tk-frame-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 16px;
  background: #141515;
  border-bottom: 1px solid #242525;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  letter-spacing: 0.04em;
  color: #6b6c6c;
}
.tk-frame-bar .file { display: flex; align-items: center; gap: 9px; color: #06c6ca; }
.tk-frame-bar .dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #06c6ca; box-shadow: 0 0 10px #06c6ca;
}
.tk-frame-bar .ctrls { display: flex; gap: 12px; }
.tk-frame-bar .ctrls .sq { width: 10px; height: 10px; border: 1px solid #5a5b5b; border-radius: 2px; }
.tk-pdf { display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; background: #000; }

/* resources list */
.tk-res { display: flex; flex-direction: column; }
.tk-res a {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding: 13px 4px;
  text-decoration: none !important;
  color: inherit !important;
  border-bottom: 1px dashed #2a3a38;
}
.tk-res a:first-child {
  border-top: 1px dashed #2a3a38;
}
.tk-res .r {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px; font-weight: 600; color: grey;
}
.tk-res .name {
  font-family: 'JetBrains Mono', monospace;
  font-size: 15px; color: #06c6ca;
}
.tk-res .fill {
  flex: 1;
  /* border-bottom: 1px dotted #2f4744; */ 
}
.tk-res .kind {
  font-family: 'Caveat', cursive;
  font-size: 19px;
  color: #7f9693;
}
.tk-res a:hover .name {
  color: #7ff0f0; 
}

.tk-note {
  margin-top: 34px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  color: #4f635f;
}