html, body { overflow-x: clip; }
.drawer-tools { display: grid; gap: 9px; margin-top: 27px; }
.drawer-tool { display: grid; grid-template-columns: 1fr auto; gap: 3px 12px; padding: 11px 0; border-bottom: 1px solid rgba(242,238,231,.11); color: var(--paper); background: transparent; text-align: left; }
.drawer-tool span { font: 9px var(--mono); letter-spacing: .13em; }
.drawer-tool b { color: #8f9c93; font: 12px var(--serif); font-weight: 400; }
.drawer-tool i { grid-row: 1 / span 2; grid-column: 2; align-self: center; color: var(--coral); font: 14px var(--sans); font-style: normal; }
.opening-dna { position: absolute; z-index: 4; right: 6vw; bottom: 12%; display: grid; gap: 7px; color: rgba(242,238,231,.45); font: 8px var(--mono); letter-spacing: .16em; }
.opening-dna b { color: var(--jade); font-weight: 400; }
.ancient-lab > .evolution-panel { grid-column: 1 / -1; }
.evolution-canvas { grid-column: 1 / -1; width: 100%; height: 34px; margin-bottom: -4px; }
.evolution-panel.is-expanded { border-color: rgba(237,101,79,.45); background: rgba(17,22,25,.45); }
.custom-cursor { position: fixed; z-index: 200; top: -18px; left: -18px; width: 36px; height: 36px; pointer-events: none; mix-blend-mode: difference; transition: width .25s, height .25s; }
.custom-cursor::before { content: ""; position: absolute; inset: 9px; border-radius: 50%; background: var(--paper); }
.custom-cursor::after { content: ""; position: absolute; inset: 0; border: 1px solid var(--paper); border-radius: 50%; transform: scale(.75); opacity: .7; transition: transform .25s; }
.custom-cursor b { position: absolute; top: 42px; left: 50%; color: var(--paper); font: 8px var(--mono); letter-spacing: .08em; transform: translateX(-50%); opacity: 0; transition: opacity .25s; }
.custom-cursor.is-active::after { transform: scale(1.12); }
.custom-cursor.is-active b { opacity: 1; }
.human-header > .archive-action { flex: 0 0 auto; align-self: end; }
.human-header { flex-wrap: wrap; }
.sound-line, .start-button, .guided-button, .archive-action, .compare-action, .save-button, .restart-button, button, a { cursor: none; }

@media (max-width: 680px) {
  .opening-dna { right: 18px; bottom: 12%; font-size: 7px; }
  .human-header > .archive-action { justify-self: start; }
  .custom-cursor { display: none; }
  .sound-line, .start-button, .guided-button, .archive-action, .compare-action, .save-button, .restart-button, button, a { cursor: pointer; }
  .evolution-canvas { height: 27px; }
}

/* CURSOR SCALE / v1.0.6 */
.custom-cursor { width: 25px !important; height: 25px !important; top: -12px !important; left: -12px !important; opacity: .72 !important; }
.custom-cursor::before { inset: 7px !important; opacity: .7 !important; }