/* DiePack: styles that exist only in this tool. Shared look: ../../shared/css/style.css */

/* Page shell ---------------------------------------------------------------
   Desktop: a fixed one-screen cockpit. Below 1024px the columns stack and
   the page scrolls normally (the original locked overflow on every screen
   size, which made the app unusable on phones and small laptops). */

html, body { min-height: 100%; }

.app-shell { min-height: 100vh; min-height: 100dvh; }

@media (min-width: 1024px) {
  html, body { height: 100%; overflow: hidden; }

  .app-shell { height: 100vh; height: 100dvh; }
}

.crystal-well-3d.is-drop-target {
  border-color: #6366f1;
  border-style: dashed;
  background: #eef2ff;
  box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.2);
}

/* DiePack ------------------------------------------------------------------ */

.cad-canvas { cursor: grab; touch-action: none; }

.cad-canvas.is-grabbing { cursor: grabbing; }

.cad-canvas:focus-visible { outline: 2px solid #6366f1; outline-offset: 2px; }

.cad-label { font: 600 11px 'Geist', 'Plus Jakarta Sans', sans-serif; fill: #475569; pointer-events: none; }

.cad-dim { font: 500 9.5px 'Geist', 'Plus Jakarta Sans', sans-serif; fill: #94a3b8; font-variant-numeric: tabular-nums; pointer-events: none; }

.unit-btn { color: #475569; }

.unit-btn:hover { color: #0f172a; }

.unit-btn.is-active { background: #4f46e5; color: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); }

.crystal-well-3d.is-invalid { border-color: #e11d48; box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.15); }

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

input[type="number"] { -moz-appearance: textfield; appearance: textfield; }

kbd { font: 600 0.85em ui-monospace, Menlo, Consolas, monospace; padding: 0 0.3em; border: 1px solid #cbd5e1; border-radius: 4px; background: #f8fafc; }
