diff --git a/samples/hp48/index.html b/samples/hp48/index.html
deleted file mode 100644
index 6f2b973..0000000
--- a/samples/hp48/index.html
+++ /dev/null
@@ -1,1079 +0,0 @@
-<!doctype html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <title>HP48-style RPN Calculator</title>
-  <style>
-    :root {
-      --body: #d8d8d8;
-      --panel: #202020;
-      --panel-2: #2b2b2b;
-      --screen: #d8e7b8;
-      --screen-text: #1b2a12;
-      --screen-dim: #5b6f45;
-      --key: #3a3a3a;
-      --key-text: #f2f2f2;
-      --accent: #8cff6d;
-      --border: #111;
-      --key-number: #5a5a5a;
-      --key-number-2: #444;
-      --key-arithmetic: #7f5c24;
-      --key-arithmetic-2: #5f4216;
-      --key-trig: #2d6d73;
-      --key-trig-2: #1f4f54;
-      --key-stack: #6b4a8f;
-      --key-stack-2: #4f356b;
-      --key-special: #3d5d8a;
-      --key-special-2: #2c4464;
-      --key-danger: #8a3f3f;
-      --key-danger-2: #632d2d;
-      --key-enter: #5d8a3d;
-      --key-enter-2: #45662e;
-    }
-
-    * { box-sizing: border-box; }
-
-    body {
-      margin: 0;
-      font-family: Arial, sans-serif;
-      background: linear-gradient(180deg, #efefef, var(--body));
-      color: #111;
-    }
-
-    .wrap {
-      max-width: 980px;
-      margin: 0 auto;
-      padding: 24px;
-    }
-
-    .calc {
-      background: linear-gradient(180deg, #2f2f2f, #1f1f1f);
-      border: 1px solid #111;
-      border-radius: 20px;
-      padding: 18px;
-      box-shadow: 0 18px 48px rgba(0, 0, 0, 0.25);
-    }
-
-
-    .screen {
-      background: linear-gradient(180deg, #dbe8b8, var(--screen));
-      color: var(--screen-text);
-      border: 2px inset #8aa36b;
-      border-radius: 10px;
-      padding: 14px;
-      min-height: 190px;
-      font-family: "Courier New", monospace;
-      display: grid;
-      grid-template-rows: auto auto 1fr;
-      gap: 10px;
-    }
-
-    .screen-top {
-      display: flex;
-      justify-content: space-between;
-      gap: 12px;
-      font-size: 12px;
-      color: var(--screen-dim);
-    }
-
-    .stack {
-      border-top: 1px solid rgba(27, 42, 18, 0.35);
-      padding-top: 10px;
-      line-height: 1.5;
-      font-size: 18px;
-      white-space: pre-wrap;
-    }
-
-    .stack-line {
-      display: grid;
-      grid-template-columns: 26px 1fr;
-      gap: 8px;
-      padding: 1px 4px;
-      border-radius: 4px;
-    }
-
-    .stack-line.selected {
-      background: rgba(27, 42, 18, 0.14);
-      outline: 1px dashed rgba(27, 42, 18, 0.45);
-    }
-
-    .stack-line.moving {
-      background: rgba(140, 255, 109, 0.18);
-      outline: 1px solid rgba(27, 42, 18, 0.55);
-    }
-
-    .stack-line .label {
-      text-align: right;
-      color: var(--screen-dim);
-    }
-
-    .stack-line.selected .label,
-    .stack-line.moving .label {
-      color: var(--screen-text);
-      font-weight: bold;
-    }
-
-    .hidden-input {
-      position: absolute;
-      left: -9999px;
-      width: 1px;
-      height: 1px;
-      opacity: 0;
-      pointer-events: none;
-    }
-
-    input, button {
-      border-radius: 10px;
-      border: 1px solid #000;
-      font: inherit;
-    }
-
-    .panel {
-      position: relative;
-      margin-top: 14px;
-      background: rgba(255, 255, 255, 0.04);
-      border: 1px solid rgba(255, 255, 255, 0.08);
-      border-radius: 14px;
-      padding: 14px;
-    }
-
-    .keypad-wrap {
-      display: grid;
-      grid-template-columns: minmax(0, 4fr) minmax(0, 3fr) minmax(0, 2fr);
-      gap: 12px;
-      align-items: start;
-    }
-
-    .keypad-group {
-      display: grid;
-      gap: 8px;
-    }
-
-    .keypad-group.functions {
-      grid-template-columns: repeat(4, minmax(0, 1fr));
-    }
-
-    .keypad-group.numbers {
-      grid-template-columns: repeat(3, minmax(0, 1fr));
-    }
-
-    .keypad-group.operators {
-      grid-template-columns: repeat(2, minmax(0, 1fr));
-    }
-
-    .keypad-group button,
-    .keypad-group .keypad-spacer {
-      min-height: 46px;
-    }
-
-    .keypad-spacer {
-      min-height: 46px;
-    }
-
-    .keypad button.active-toggle,
-    .active-toggle {
-      background: linear-gradient(180deg, #6a8c52, #49693a);
-      color: #fff;
-    }
-
-    .key-number {
-      background: linear-gradient(180deg, var(--key-number), var(--key-number-2));
-    }
-
-    .key-arithmetic {
-      background: linear-gradient(180deg, var(--key-arithmetic), var(--key-arithmetic-2));
-    }
-
-    .key-trigonometry {
-      background: linear-gradient(180deg, var(--key-trig), var(--key-trig-2));
-    }
-
-    .key-stack {
-      background: linear-gradient(180deg, var(--key-stack), var(--key-stack-2));
-    }
-
-    .key-special {
-      background: linear-gradient(180deg, var(--key-special), var(--key-special-2));
-    }
-
-    .key-danger {
-      background: linear-gradient(180deg, var(--key-danger), var(--key-danger-2));
-    }
-
-    .key-enter {
-      background: linear-gradient(180deg, var(--key-enter), var(--key-enter-2));
-      font-weight: bold;
-    }
-
-    .keypad-group button.enter-tall {
-      grid-row: span 2;
-    }
-
-    button {
-      padding: 12px 10px;
-      background: linear-gradient(180deg, #4a4a4a, var(--key));
-      color: var(--key-text);
-      cursor: pointer;
-      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
-    }
-
-    button:hover { filter: brightness(1.08); }
-    button:active { transform: translateY(1px); }
-
-
-    .popup-menu {
-      position: absolute;
-      top: 54px;
-      left: 14px;
-      z-index: 10;
-      display: grid;
-      gap: 6px;
-      min-width: 84px;
-      padding: 8px;
-      background: linear-gradient(180deg, #373737, #242424);
-      border: 1px solid rgba(255, 255, 255, 0.12);
-      border-radius: 12px;
-      box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
-    }
-
-    .popup-menu[hidden] {
-      display: none;
-    }
-
-    .popup-menu button {
-      width: 100%;
-      min-height: 40px;
-    }
-
-    .display-error {
-      color: #8a2a1c;
-      font-weight: bold;
-    }
-
-
-    @media (max-width: 820px) {
-      .wrap {
-        padding: 16px;
-      }
-
-      .keypad-wrap {
-        gap: 8px;
-      }
-
-      .keypad-group.functions {
-        grid-template-columns: repeat(2, minmax(0, 1fr));
-      }
-
-      .keypad-group.numbers,
-      .keypad-group.operators {
-        grid-template-columns: repeat(2, minmax(0, 1fr));
-      }
-    }
-
-    @media (max-width: 640px) {
-      .calc {
-        padding: 14px;
-        border-radius: 16px;
-      }
-
-      .keypad-wrap {
-        grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
-        gap: 8px;
-      }
-
-      .keypad-group.functions {
-        grid-column: 1 / -1;
-        grid-row: 2;
-        grid-template-columns: repeat(3, minmax(0, 1fr));
-      }
-
-      .keypad-group.numbers {
-        grid-column: 1;
-        grid-row: 1;
-        grid-template-columns: repeat(3, minmax(0, 1fr));
-      }
-
-      .keypad-group.operators {
-        grid-column: 2;
-        grid-row: 1;
-        grid-template-columns: repeat(2, minmax(0, 1fr));
-      }
-    }
-  </style>
-</head>
-<body>
-  <div class="wrap">
-    <div class="calc">
-      <div class="screen" id="screen" tabindex="0" role="application" aria-label="HP48 style calculator screen">
-        <div class="screen-top">
-          <div>RPN stack</div>
-          <div id="modeLabel">deg</div>
-        </div>
-        <div id="stack" class="stack"></div>
-        <div id="display"></div>
-      </div>
-
-      <input id="input" class="hidden-input" type="text" autocomplete="off" aria-hidden="true" tabindex="-1">
-
-      <div class="panel" id="keypadPanel">
-        <div class="keypad-wrap">
-          <div class="keypad-group functions" id="functionsKeypad"></div>
-          <div class="keypad-group numbers" id="numbersKeypad"></div>
-          <div class="keypad-group operators" id="operatorsKeypad"></div>
-        </div>
-        <div id="angleModeMenu" class="popup-menu" hidden>
-          <button type="button" data-angle-mode="deg">deg</button>
-          <button type="button" data-angle-mode="rad">rad</button>
-          <button type="button" data-angle-mode="grad">grad</button>
-        </div>
-        <div id="constantsMenu" class="popup-menu" hidden>
-          <button type="button" data-const="pi">π</button>
-          <button type="button" data-const="e">e</button>
-        </div>
-      </div>
-
-    </div>
-  </div>
-
-  <script src="../../src/rpn-calculator.js"></script>
-  <script>
-    const calc = new RpnCalculator({ angleMode: 'deg' });
-    const input = document.getElementById('input');
-    const screen = document.getElementById('screen');
-    const stackEl = document.getElementById('stack');
-
-    const displayEl = document.getElementById('display');
-    const modeLabel = document.getElementById('modeLabel');
-    const functionsKeypadEl = document.getElementById('functionsKeypad');
-    const numbersKeypadEl = document.getElementById('numbersKeypad');
-    const operatorsKeypadEl = document.getElementById('operatorsKeypad');
-    const keypadPanelEl = document.getElementById('keypadPanel');
-    const angleModeMenuEl = document.getElementById('angleModeMenu');
-    const constantsMenuEl = document.getElementById('constantsMenu');
-
-    let stackCursor = null;
-    let openMenuName = null;
-    let isMovingStackItem = false;
-    let stackSnapshotBeforeMove = null;
-    let currentErrorMessage = '';
-
-    function getKeypadLayout() {
-      return {
-        functions: [
-          [
-            { label: calc.angleMode, type: 'special', value: 'toggleAngleModeMenu', active: openMenuName === 'angle-mode', menuAnchor: 'angle-mode' },
-            { label: 'consts', type: 'special', value: 'toggleConstsMenu', active: openMenuName === 'constants', menuAnchor: 'constants' },
-            null,
-            null,
-          ],
-          [
-            { label: 'sqrt', type: 'command', value: 'sqrt' },
-            { label: 'y^x', type: 'command', value: 'pow' },
-            { label: 'x²', type: 'command', value: 'sqr' },
-            { label: '1/x', type: 'command', value: 'recip' },
-          ],
-          [
-            { label: 'log', type: 'command', value: 'log' },
-            { label: 'ln', type: 'command', value: 'ln' },
-            null,
-            { label: '%', type: 'command', value: 'mod' },
-          ],
-          [
-            { label: 'sin', type: 'command', value: 'sin' },
-            { label: 'cos', type: 'command', value: 'cos' },
-            { label: 'tan', type: 'command', value: 'tan' },
-            null,
-          ],
-          [
-            { label: 'asin', type: 'command', value: 'asin' },
-            { label: 'acos', type: 'command', value: 'acos' },
-            { label: 'atan', type: 'command', value: 'atan' },
-            null,
-          ],
-        ],
-        numbers: [
-          [null, null, null],
-          [
-            { label: '7', type: 'input', value: '7' },
-            { label: '8', type: 'input', value: '8' },
-            { label: '9', type: 'input', value: '9' },
-          ],
-          [
-            { label: '4', type: 'input', value: '4' },
-            { label: '5', type: 'input', value: '5' },
-            { label: '6', type: 'input', value: '6' },
-          ],
-          [
-            { label: '1', type: 'input', value: '1' },
-            { label: '2', type: 'input', value: '2' },
-            { label: '3', type: 'input', value: '3' },
-          ],
-          [
-            { label: '0', type: 'input', value: '0' },
-            { label: '.', type: 'input', value: '.' },
-            { label: '+/-', type: 'command', value: 'neg' },
-          ],
-        ],
-        operators: [
-          [
-            { label: 'del', type: 'special', value: 'clear' },
-            { label: 'esc', type: 'special', value: 'escape' },
-          ],
-          [
-            { label: '/', type: 'command', value: 'div' },
-            { label: 'backspace', type: 'special', value: 'backspace' },
-          ],
-          [
-            { label: '*', type: 'command', value: 'mul' },
-            null,
-          ],
-          [
-            { label: '-', type: 'command', value: 'sub' },
-            { label: 'Enter', type: 'command', value: 'enter', rowspan: 2 },
-          ],
-          [
-            { label: '+', type: 'command', value: 'add' },
-            null,
-          ],
-        ],
-      };
-    }
-
-    function getKeyClassName(key) {
-      if (key.type === 'input') {
-        return 'key-number';
-      }
-
-      if (key.value === 'clear') {
-        return 'key-danger';
-      }
-
-      if (key.value === 'enter') {
-        return 'key-enter';
-      }
-
-      if (key.type === 'special') {
-        return 'key-special';
-      }
-
-      const stackCommands = new Set(['neg']);
-      const arithmeticCommands = new Set(['add', 'sub', 'mul', 'div', 'mod', 'pow', 'sqr', 'sqrt', 'recip', 'log', 'ln']);
-      const trigonometryCommands = new Set(['sin', 'cos', 'tan', 'asin', 'acos', 'atan']);
-
-      if (stackCommands.has(key.value)) {
-        return 'key-stack';
-      }
-
-      if (arithmeticCommands.has(key.value)) {
-        return 'key-arithmetic';
-      }
-
-      if (trigonometryCommands.has(key.value)) {
-        return 'key-trigonometry';
-      }
-
-      return '';
-    }
-
-    function renderKeypadGroup(groupEl, layout) {
-      groupEl.innerHTML = '';
-      const occupied = new Set();
-
-      layout.forEach((row, rowIndex) => {
-        row.forEach((key, colIndex) => {
-          const cellId = `${rowIndex}-${colIndex}`;
-          if (occupied.has(cellId)) {
-            return;
-          }
-
-          if (!key) {
-            const spacer = document.createElement('div');
-            spacer.className = 'keypad-spacer';
-            spacer.style.gridColumn = String(colIndex + 1);
-            spacer.style.gridRow = String(rowIndex + 1);
-            groupEl.appendChild(spacer);
-            return;
-          }
-
-          const button = document.createElement('button');
-          button.textContent = key.label;
-          const keyClassName = getKeyClassName(key);
-          if (keyClassName) {
-            button.classList.add(keyClassName);
-          }
-          button.style.gridColumn = String(colIndex + 1);
-          button.style.gridRow = `${rowIndex + 1} / span ${key.rowspan || 1}`;
-          if (key.rowspan && key.rowspan > 1) {
-            button.classList.add('enter-tall');
-            for (let offset = 1; offset < key.rowspan; offset += 1) {
-              occupied.add(`${rowIndex + offset}-${colIndex}`);
-            }
-          }
-          if (key.active) {
-            button.classList.add('active-toggle');
-          }
-          if (key.menuAnchor) {
-            button.dataset.menuAnchor = key.menuAnchor;
-          }
-          button.addEventListener('click', (event) => handleKeypadAction(key, event));
-          groupEl.appendChild(button);
-        });
-      });
-    }
-
-    function renderKeypad() {
-      const layout = getKeypadLayout();
-      renderKeypadGroup(functionsKeypadEl, layout.functions);
-      renderKeypadGroup(numbersKeypadEl, layout.numbers);
-      renderKeypadGroup(operatorsKeypadEl, layout.operators);
-      if (openMenuName) {
-        positionMenu(openMenuName);
-      }
-    }
-
-    function getMenuElement(name) {
-      if (name === 'angle-mode') {
-        return angleModeMenuEl;
-      }
-      if (name === 'constants') {
-        return constantsMenuEl;
-      }
-      return null;
-    }
-
-    function openMenu(name, anchorEl) {
-      const menuEl = getMenuElement(name);
-      if (!menuEl) {
-        return;
-      }
-
-      closeMenu();
-      openMenuName = name;
-      menuEl.hidden = false;
-
-      if (anchorEl) {
-        const panelRect = keypadPanelEl.getBoundingClientRect();
-        const anchorRect = anchorEl.getBoundingClientRect();
-        menuEl.style.left = `${anchorRect.left - panelRect.left}px`;
-        menuEl.style.top = `${anchorRect.bottom - panelRect.top + 6}px`;
-      }
-    }
-
-    function closeMenu() {
-      openMenuName = null;
-      angleModeMenuEl.hidden = true;
-      constantsMenuEl.hidden = true;
-    }
-
-    function positionMenu(name) {
-      const anchorEl = keypadPanelEl.querySelector(`[data-menu-anchor="${name}"]`);
-      if (!anchorEl) {
-        return;
-      }
-      openMenu(name, anchorEl);
-    }
-
-    function toggleMenu(name, anchorEl) {
-      if (openMenuName === name) {
-        closeMenu();
-        return;
-      }
-      openMenu(name, anchorEl);
-    }
-
-    function runEscapeAction() {
-      if (openMenuName) {
-        closeMenu();
-        render();
-        return;
-      }
-      if (calc.isEditing) {
-        calc.inputValue = '';
-        calc.isEditing = false;
-        syncInputFromState();
-        render();
-        return;
-      }
-      if (isMovingStackItem) {
-        cancelMoveMode();
-        render();
-      }
-    }
-
-    function handleKeypadAction(key, event) {
-      try {
-        if (key.type === 'input') {
-          clearStackSelection();
-          editXWithKey(key.value);
-          render();
-          return;
-        }
-
-        if (key.type === 'special') {
-          if (key.value === 'toggleAngleModeMenu') {
-            toggleMenu('angle-mode', event?.currentTarget);
-            render();
-            return;
-          }
-          if (key.value === 'toggleConstsMenu') {
-            toggleMenu('constants', event?.currentTarget);
-            render();
-            return;
-          }
-          if (key.value === 'backspace') {
-            if (calc.isEditing) {
-              editXWithKey('Backspace');
-              render();
-            } else {
-              execute('drop');
-            }
-            return;
-          }
-          if (key.value === 'clear') {
-            execute('clear');
-            return;
-          }
-          if (key.value === 'escape') {
-            runEscapeAction();
-          }
-          return;
-        }
-
-        if (key.type === 'command') {
-          execute(key.value);
-        }
-      } catch (error) {
-        currentErrorMessage = error.message;
-        render();
-      }
-    }
-
-    function getStackValue(index) {
-      return calc.isValidIndex(index) ? calc.stack[index] : undefined;
-    }
-
-    function getLineValue(line) {
-      if (calc.isEditing) {
-        if (line === 0) {
-          return calc.inputValue;
-        }
-        return getStackValue(line - 1);
-      }
-      return getStackValue(line);
-    }
-
-    function hasStackSelection() {
-      return stackCursor !== null && calc.isValidIndex(stackCursor);
-    }
-
-    function clearStackSelection() {
-      stackCursor = null;
-      isMovingStackItem = false;
-      stackSnapshotBeforeMove = null;
-    }
-
-    function ensureValidSelection() {
-      if (hasStackSelection()) {
-        return;
-      }
-      stackCursor = calc.isValidIndex(0) ? 0 : null;
-    }
-
-    function beginMoveMode() {
-      if (!hasStackSelection()) {
-        return;
-      }
-      isMovingStackItem = true;
-      stackSnapshotBeforeMove = calc.stack.slice();
-    }
-
-    function commitMoveMode() {
-      isMovingStackItem = false;
-      stackSnapshotBeforeMove = null;
-    }
-
-    function cancelMoveMode() {
-      if (!isMovingStackItem || !stackSnapshotBeforeMove) {
-        return;
-      }
-
-      const snapshot = stackSnapshotBeforeMove.slice();
-      calc.clear();
-      for (let index = snapshot.length - 1; index >= 0; index -= 1) {
-        calc.push(snapshot[index]);
-      }
-
-      isMovingStackItem = false;
-      stackSnapshotBeforeMove = null;
-      stackCursor = calc.isValidIndex(stackCursor) ? stackCursor : (calc.isValidIndex(0) ? 0 : null);
-      syncInputFromState();
-    }
-
-    function reactivateEditOnX() {
-      clearStackSelection();
-      if (calc.isValidIndex(0)) {
-        const value = getStackValue(0);
-        calc.remove(0);
-        calc.inputValue = calc.formatNumber(value);
-        calc.isEditing = true;
-      } else {
-        calc.inputValue = '';
-        calc.isEditing = true;
-      }
-      syncInputFromState();
-    }
-
-    function moveStackSelection(direction) {
-      if (!hasStackSelection()) {
-        if (direction === 'up') {
-          ensureValidSelection();
-        } else {
-          reactivateEditOnX();
-        }
-        return;
-      }
-
-      const nextIndex = direction === 'up' ? stackCursor + 1 : stackCursor - 1;
-      if (calc.isValidIndex(nextIndex)) {
-        stackCursor = nextIndex;
-        return;
-      }
-
-      if (direction === 'down' && stackCursor === 0) {
-        reactivateEditOnX();
-      }
-    }
-
-    function moveStackItem(direction) {
-      if (!hasStackSelection()) {
-        return;
-      }
-
-      const targetIndex = direction === 'up' ? stackCursor + 1 : stackCursor - 1;
-      if (!calc.isValidIndex(targetIndex)) {
-        return;
-      }
-
-      calc.swap(stackCursor, targetIndex);
-      stackCursor = targetIndex;
-    }
-
-    function render() {
-      const names = ['T', 'Z', 'Y', 'X'];
-      const lines = [];
-      for (let line = 3; line >= 0; line -= 1) {
-        const value = getLineValue(line);
-        const isSelected = stackCursor === line;
-        const classes = ['stack-line'];
-        if (isSelected) {
-          classes.push(isMovingStackItem ? 'moving' : 'selected');
-        }
-        lines.push(`<div class="${classes.join(' ')}"><div class="label">${names[3 - line]}</div><div>${value !== undefined && value !== '' ? calc.formatNumber(value) : ''}</div></div>`);
-      }
-
-      stackEl.innerHTML = lines.join('');
-      if (currentErrorMessage) {
-        displayEl.textContent = `ERROR: ${currentErrorMessage}`;
-        displayEl.classList.add('display-error');
-      } else if (calc.isEditing) {
-        displayEl.textContent = `ENTERING: ${calc.inputValue}`;
-        displayEl.classList.remove('display-error');
-      } else if (isMovingStackItem && hasStackSelection()) {
-        displayEl.textContent = `MOVING: ${['X', 'Y', 'Z', 'T'][stackCursor] || '?'}`;
-        displayEl.classList.remove('display-error');
-      } else if (hasStackSelection()) {
-        displayEl.textContent = `SELECTED: ${['X', 'Y', 'Z', 'T'][stackCursor] || '?'}`;
-        displayEl.classList.remove('display-error');
-      } else {
-        displayEl.textContent = 'READY';
-        displayEl.classList.remove('display-error');
-      }
-      modeLabel.textContent = calc.angleMode;
-      renderKeypad();
-    }
-
-    function pushEditingValueIfNeeded() {
-      if (!calc.isEditing) return;
-      if (calc.inputValue !== '') {
-        const value = calc.parseInputValue(calc.inputValue);
-        calc.push(value);
-      }
-      calc.inputValue = '';
-      calc.isEditing = false;
-      syncInputFromState();
-    }
-
-    function execute(name) {
-      try {
-        if (name === 'enter') {
-          if (calc.isEditing) {
-            pushEditingValueIfNeeded();
-          } else if (calc.isValidIndex(0)) {
-            calc.push(getStackValue(0));
-          }
-        } else if (name === 'swap') {
-          pushEditingValueIfNeeded();
-          clearStackSelection();
-          if (calc.isValidIndex(1)) calc.swap(0, 1);
-        } else if (name === 'drop') {
-          pushEditingValueIfNeeded();
-          if (hasStackSelection()) {
-            calc.remove(stackCursor);
-            stackCursor = calc.isValidIndex(stackCursor) ? stackCursor : (calc.isValidIndex(stackCursor - 1) ? stackCursor - 1 : null);
-          } else if (calc.isValidIndex(0)) {
-            calc.remove(0);
-          }
-          commitMoveMode();
-        } else if (name === 'clear') {
-          calc.clear();
-          clearStackSelection();
-        } else {
-          pushEditingValueIfNeeded();
-          clearStackSelection();
-          calc.command(name);
-        }
-        currentErrorMessage = '';
-        syncInputFromState();
-        render();
-      } catch (error) {
-        currentErrorMessage = error.message;
-        render();
-      }
-    }
-
-    function isInputChar(key) {
-      return /^[0-9a-fA-F.]$/.test(key);
-    }
-
-    function shouldIgnoreKeyboardEvent(event) {
-      const target = event.target;
-      if (!target) return false;
-
-      const tagName = target.tagName;
-      return (
-        tagName === 'INPUT' ||
-        tagName === 'TEXTAREA' ||
-        tagName === 'SELECT' ||
-        target.isContentEditable
-      );
-    }
-
-    function getKeyboardAction(event) {
-      const numpadMap = {
-        Numpad0: { type: 'input', value: '0' },
-        Numpad1: { type: 'input', value: '1' },
-        Numpad2: { type: 'input', value: '2' },
-        Numpad3: { type: 'input', value: '3' },
-        Numpad4: { type: 'input', value: '4' },
-        Numpad5: { type: 'input', value: '5' },
-        Numpad6: { type: 'input', value: '6' },
-        Numpad7: { type: 'input', value: '7' },
-        Numpad8: { type: 'input', value: '8' },
-        Numpad9: { type: 'input', value: '9' },
-        NumpadDecimal: { type: 'input', value: '.' },
-        NumpadAdd: { type: 'command', value: 'add' },
-        NumpadSubtract: { type: 'command', value: 'sub' },
-        NumpadMultiply: { type: 'command', value: 'mul' },
-        NumpadDivide: { type: 'command', value: 'div' },
-        NumpadEnter: { type: 'command', value: 'enter' },
-      };
-
-      if (numpadMap[event.code]) {
-        return numpadMap[event.code];
-      }
-
-      if (isInputChar(event.key)) {
-        return { type: 'input', value: event.key };
-      }
-
-      const keyMap = {
-        Enter: { type: 'enterKey' },
-        Backspace: { type: 'stackOrEdit', value: 'drop' },
-        Delete: { type: 'command', value: 'clear' },
-        Escape: { type: 'escapeKey' },
-        ArrowUp: { type: 'stackArrow', value: 'up' },
-        ArrowDown: { type: 'stackArrow', value: 'down' },
-        ArrowRight: { type: 'command', value: 'swap' },
-        '+': { type: 'command', value: 'add' },
-        '-': { type: 'command', value: 'sub' },
-        '*': { type: 'command', value: 'mul' },
-        '/': { type: 'command', value: 'div' },
-        '%': { type: 'command', value: 'mod' },
-        '^': { type: 'command', value: 'pow' },
-        q: { type: 'command', value: 'sqr' },
-        n: { type: 'command', value: 'neg' },
-        r: { type: 'command', value: 'sqrt' },
-        i: { type: 'command', value: 'recip' },
-        g: { type: 'command', value: 'log' },
-        l: { type: 'command', value: 'ln' },
-        s: { type: 'command', value: 'sin' },
-        c: { type: 'command', value: 'cos' },
-        S: { type: 'command', value: 'asin' },
-        C: { type: 'command', value: 'acos' },
-        x: { type: 'stackSelect', value: 0 },
-        y: { type: 'stackSelect', value: 1 },
-        z: { type: 'stackSelect', value: 2 },
-        t: { type: 'stackSelect', value: 3 },
-        X: { type: 'stackSelect', value: 0 },
-        Y: { type: 'stackSelect', value: 1 },
-        Z: { type: 'stackSelect', value: 2 },
-        T: { type: 'stackSelect', value: 3 },
-      };
-
-      return keyMap[event.key] || null;
-    }
-
-    function focusScreen() {
-      screen.focus();
-    }
-
-    function syncInputFromState() {
-      input.value = calc.inputValue;
-    }
-
-    function editXWithKey(key) {
-      if (!calc.isEditing) {
-        pushEditingValueIfNeeded();
-        calc.isEditing = true;
-        calc.inputValue = '';
-      }
-      if (key === 'Backspace') {
-        calc.inputValue = calc.inputValue.slice(0, -1);
-      } else {
-        calc.inputValue += key;
-      }
-      if (calc.inputValue === '') {
-        calc.isEditing = false;
-      }
-      syncInputFromState();
-    }
-
-    function handleKeydown(event) {
-      if (shouldIgnoreKeyboardEvent(event)) {
-        return;
-      }
-
-      const action = getKeyboardAction(event);
-      if (!action) {
-        return;
-      }
-
-      try {
-        if (action.type === 'escapeKey') {
-          event.preventDefault();
-          runEscapeAction();
-          return;
-        }
-
-        event.preventDefault();
-
-        if (action.type === 'input') {
-          clearStackSelection();
-          editXWithKey(action.value);
-          render();
-          return;
-        }
-
-        if (action.type === 'stackSelect') {
-          if (calc.isEditing || isMovingStackItem) {
-            return;
-          }
-          stackCursor = calc.isValidIndex(action.value) ? action.value : null;
-          render();
-          return;
-        }
-
-        if (action.type === 'stackArrow') {
-          if (isMovingStackItem) {
-            moveStackItem(action.value);
-          } else {
-            moveStackSelection(action.value);
-          }
-          render();
-          return;
-        }
-
-        if (action.type === 'stackOrEdit') {
-          if (calc.isEditing) {
-            editXWithKey('Backspace');
-            render();
-          } else {
-            execute(action.value);
-          }
-          return;
-        }
-
-        if (action.type === 'enterKey') {
-          if (hasStackSelection()) {
-            if (isMovingStackItem) {
-              commitMoveMode();
-            } else {
-              beginMoveMode();
-            }
-            render();
-            return;
-          }
-          execute('enter');
-          return;
-        }
-
-        if (action.type === 'command') {
-          execute(action.value);
-        }
-      } catch (error) {
-        currentErrorMessage = error.message;
-        render();
-      }
-    }
-
-    window.addEventListener('keydown', handleKeydown);
-
-    angleModeMenuEl.addEventListener('click', (event) => {
-      const button = event.target.closest('[data-angle-mode]');
-      if (!button) {
-        return;
-      }
-      calc.angleMode = button.dataset.angleMode;
-      closeMenu();
-      render();
-    });
-
-    constantsMenuEl.addEventListener('click', (event) => {
-      const button = event.target.closest('[data-const]');
-      if (!button) {
-        return;
-      }
-      closeMenu();
-      execute(button.dataset.const);
-    });
-
-    document.addEventListener('click', (event) => {
-      if (!openMenuName) {
-        return;
-      }
-      const openMenuEl = getMenuElement(openMenuName);
-      if (openMenuEl && openMenuEl.contains(event.target)) {
-        return;
-      }
-      if (event.target.closest(`[data-menu-anchor="${openMenuName}"]`)) {
-        return;
-      }
-      closeMenu();
-      render();
-    });
-
-    window.addEventListener('resize', () => {
-      if (openMenuName) {
-        positionMenu(openMenuName);
-      }
-    });
-
-    screen.addEventListener('click', focusScreen);
-    window.addEventListener('load', focusScreen);
-
-    render();
-    focusScreen();
-  </script>
-</body>
-</html>
\ No newline at end of file
