/*@3.LAHC.1*/

:root {
  --lab-accent: #a78bfa;
  --lab-accent-deep: #7c3aed;
  --lab-accent-soft: rgba(167, 139, 250, .14);
  --lab-accent-line: rgba(167, 139, 250, .34);
  --lab-glow: rgba(124, 58, 237, .22);
}

/*@3.LAHC.2*/
:root[data-theme="light"] {
  --lab-accent: #7c3aed;
  --lab-accent-deep: #6d28d9;
  --lab-accent-soft: rgba(124, 58, 237, .09);
  --lab-accent-line: rgba(124, 58, 237, .28);
  --lab-glow: rgba(124, 58, 237, .16);
}

/*@3.LAHC.3*/

.lx-stats { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.lx-stats[hidden] { display: none; }
.lx-stat {
  display: inline-flex; align-items: center; gap: .45rem;
  background: var(--bg-card); border: 1px solid var(--border-color);
  border-radius: var(--radius-pill); padding: .35rem .8rem;
  font-size: .8rem; color: var(--text-secondary);
}
.lx-stat > i { color: var(--lab-accent); font-size: .8rem; }
.lx-stat > b {
  font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 700;
  color: var(--text-primary); font-variant-numeric: tabular-nums;
}
/*@3.LAHC.4*/
.lx-stat--soon { color: var(--text-muted); }
.lx-stat--soon > i { color: var(--text-muted); }

/*@3.LAHC.5*/

.lx-resume {
  display: flex; align-items: center; gap: .75rem;
  padding: .75rem .9rem; margin-bottom: 1rem;
  background: var(--bg-card);
  border: 1px solid var(--lab-accent-line);
  border-radius: var(--radius-xl);
  text-decoration: none;
  transition: border-color .2s, transform .2s, box-shadow .2s;
}
.lx-resume[hidden] { display: none; }
.lx-resume:hover {
  border-color: var(--lab-accent);
  transform: translateY(-2px);
  box-shadow: 0 10px 15px -3px var(--lab-glow);
}
.lx-resume-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; flex: 0 0 auto;
  border-radius: var(--radius-md);
  background: var(--lab-accent-soft); color: var(--lab-accent);
}
.lx-resume-t { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.lx-resume-t b { color: var(--text-primary); font-size: .9rem; font-weight: 800; }
.lx-resume-t span {
  color: var(--text-muted); font-size: .82rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.lx-resume-go { margin-inline-start: auto; color: var(--lab-accent); flex: 0 0 auto; }
/*@3.LAHC.6*/
[dir="ltr"] .lx-resume-go { transform: scaleX(-1); }

/*@3.LAHC.7*/

.lx-grid { display: grid; gap: .7rem; grid-template-columns: repeat(auto-fill, minmax(322px, 1fr)); }

.lx-lab {
  position: relative; overflow: hidden; isolation: isolate;
  display: flex; flex-direction: column; gap: .55rem;
  padding: .9rem 1rem 1rem;
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-xl);
  text-decoration: none; color: inherit;
  transition: border-color .25s, transform .25s, box-shadow .25s;
}
.lx-lab:hover, .lx-lab:focus-visible {
  border-color: var(--lab-accent);
  transform: translateY(-2px);
  box-shadow: 0 10px 15px -3px var(--lab-glow);
}

/*@3.LAHC.8*/
.lx-lab-bg {
  position: absolute; z-index: -1;
  inset-block-start: -.6rem; inset-inline-end: -.8rem;
  font-size: 7.5rem; line-height: 1;
  color: var(--text-primary); opacity: .045;
  transform: rotate(0deg);
  transform-origin: 70% 30%;
  transition: transform .35s var(--skin-ease-out, cubic-bezier(.22,1,.36,1)), opacity .35s, color .25s;
  pointer-events: none;
}
:root[data-theme="light"] .lx-lab-bg { opacity: .06; }
.lx-lab:hover .lx-lab-bg,
.lx-lab:focus-visible .lx-lab-bg {
  transform: rotate(-13deg) scale(1.08);
  opacity: .1;
  color: var(--lab-accent);
}
[dir="ltr"] .lx-lab:hover .lx-lab-bg,
[dir="ltr"] .lx-lab:focus-visible .lx-lab-bg { transform: rotate(13deg) scale(1.08); }

.lx-lab-top { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.lx-lab-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; flex: 0 0 auto;
  border-radius: var(--radius-md);
  border: 1px solid var(--border-color);
  background: var(--bg-elevated); color: var(--text-secondary);
  font-size: .85rem;
  transition: color .25s, border-color .25s, background-color .25s, transform .25s;
}
/*@3.LAHC.9*/
.lx-lab:hover .lx-lab-ico {
  transform: scale(1.08);
  color: var(--lab-accent);
  border-color: var(--lab-accent-line);
  background: var(--lab-accent-soft);
}
.lx-lab-id { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: .12rem; }
.lx-lab-name {
  font-weight: 800; font-size: .96rem; line-height: 1.4; color: var(--text-primary);
}
.lx-lab-cat {
  font-size: .72rem; color: var(--text-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/*@3.LAHC.10*/
.lx-lab-v {
  flex: 0 0 auto; align-self: flex-start;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: .68rem; font-weight: 600; color: var(--text-muted);
  background: var(--bg-elevated); border: 1px solid var(--border-color);
  border-radius: var(--radius-pill); padding: .1rem .5rem;
  direction: ltr; unicode-bidi: isolate;
}

/*@3.LAHC.11*/
.lx-lab-sum {
  margin: 0; font-size: .84rem; line-height: 1.65; color: var(--text-secondary);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2;
  overflow: hidden;
  min-height: 2.78em;   /*@3.LAHC.12*/
}

/*@3.LAHC.13*/
.lx-lab-hi {
  display: grid; grid-template-columns: 1fr 1fr;
  border-block: 1px solid var(--border-color);
  padding-block: .5rem;
}
.lx-hi {
  display: flex; flex-direction: column; gap: .05rem;
  min-height: 2.45rem;
  padding-inline: .1rem;
}
.lx-hi + .lx-hi { border-inline-start: 1px solid var(--border-color); padding-inline-start: .75rem; }
.lx-hi > b {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 1.1rem; font-weight: 700; line-height: 1.2;
  color: var(--text-primary); font-variant-numeric: tabular-nums;
}
.lx-hi > span { font-size: .7rem; color: var(--text-muted); }
/*@3.LAHC.14*/
.lx-hi.is-empty { visibility: hidden; }

/*@3.LAHC.15*/
.lx-lab-str {
  display: flex; align-items: flex-start; gap: .45rem; margin: 0;
  min-height: 3.05em;
  padding: .4rem .6rem;
  border-inline-start: 3px solid var(--lab-accent-line);
  border-radius: var(--radius-sm);
  background: var(--bg-elevated);
  font-size: .78rem; line-height: 1.6; color: var(--text-secondary);
}
.lx-lab-str > i { flex: 0 0 auto; margin-block-start: .25rem; font-size: .68rem; color: var(--lab-accent); }
.lx-lab-str.is-empty { background: none; border-inline-start-color: transparent; }

/*@3.LAHC.16*/
.lx-lab-tags {
  display: flex; flex-wrap: wrap; gap: .3rem;
  block-size: calc(2 * 1.68rem + .3rem);
  overflow: hidden; align-content: flex-start;
}
.lx-tag {
  font-size: .7rem; font-weight: 600; color: var(--text-muted);
  background: transparent; border: 1px solid var(--border-color);
  border-radius: var(--radius-pill); padding: .14rem .55rem;
}
/*@3.LAHC.17*/
.lx-tag--more {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  border-style: dashed; color: var(--text-muted);
}

/*@3.LAHC.18*/
.lx-lab-foot {
  display: flex; align-items: center; flex-wrap: wrap; gap: .2rem .75rem;
  margin-top: auto; padding-top: .55rem;
  border-top: 1px solid var(--border-color);
  font-size: .74rem; color: var(--text-muted);
}
.lx-lab-f { display: inline-flex; align-items: center; gap: .3rem; }
.lx-lab-f > i { font-size: .7rem; }
.lx-lab-f b {
  font-family: 'JetBrains Mono', ui-monospace, monospace; font-weight: 700;
  color: var(--text-secondary); font-variant-numeric: tabular-nums;
}
/*@3.LAHC.19*/
.lx-lab-f--link { color: var(--st-ok, #10b981); }
.lx-lab-f--link > i { color: inherit; }
.lx-lab-f--none { opacity: .65; }
.lx-lab-go { margin-inline-start: auto; color: var(--lab-accent); font-weight: 800; }
.lx-lab-go > i { font-size: .68rem; }
[dir="ltr"] .lx-lab-go > i { transform: scaleX(-1); }

/*@3.LAHC.20*/
.lx-why {
  display: inline-flex; align-items: center; gap: .35rem;
  min-height: 1.2rem;
  font-size: .72rem; font-weight: 700;
  color: var(--lab-accent);
  align-self: flex-start;
}
.lx-why.is-empty { visibility: hidden; }

/*@3.LAHC.21*/

/*@3.LAHC.22*/
.lx-grid.is-grouped { display: block; }

.lx-grp + .lx-grp { margin-top: 1.5rem; }
/*@3.LAHC.23*/
.lx-grp-h {
  display: flex; align-items: center; gap: .5rem;
  margin: 0 0 .6rem;
  font-size: .84rem; font-weight: 800; color: var(--text-secondary);
}
.lx-grp-h > i { font-size: .8rem; color: var(--lab-accent); }
.lx-grp-h > span { flex: 0 0 auto; }
.lx-grp-h > b {
  font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: .72rem; font-weight: 700;
  color: var(--text-muted); background: var(--bg-elevated);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-pill); padding: .05rem .45rem;
}
.lx-grp-h::after { content: ''; flex: 1; border-block-start: 1px dotted var(--border-color); }

/*@3.LAHC.24*/

.lx-soon { margin-top: 2rem; }
.lx-soon[hidden] { display: none; }
.lx-soon-t {
  margin: 0 0 .25rem; font-size: .95rem; font-weight: 800; color: var(--text-secondary);
}
.lx-soon-d { margin: 0 0 .7rem; font-size: .82rem; color: var(--text-muted); }
.lx-soon-l { display: flex; flex-wrap: wrap; gap: .4rem; }
/*@3.LAHC.25*/
.lx-soon-c {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .76rem; font-weight: 700; color: var(--text-muted);
  background: var(--bg-card); border: 1px dashed var(--border-color);
  border-radius: var(--radius-pill); padding: .3rem .75rem;
}
.lx-soon-c > i { font-size: .74rem; opacity: .8; }

/*@3.LAHC.26*/

@media (max-width: 640px) {
  .lx-grid { grid-template-columns: 1fr; }
  .lx-stat { font-size: .76rem; padding: .3rem .7rem; }
}

/*@3.LAHC.27*/

@media (prefers-reduced-motion: reduce) {
  .lx-lab, .lx-resume, .lx-lab-ico, .lx-lab-bg { transition: none; }
  .lx-lab:hover, .lx-resume:hover { transform: none; }
  .lx-lab:hover .lx-lab-ico { transform: none; }
  /*@3.LAHC.28*/
  .lx-lab:hover .lx-lab-bg,
  [dir="ltr"] .lx-lab:hover .lx-lab-bg { transform: none; }
}