/* Shared JARVIS gesture window for the home and universe pages. */
.jarvis-gesture-window.camera-panel {
  position: fixed;
  z-index: 9000;
  right: 16px;
  bottom: 16px;
  width: 288px;
  gap: 0;
  padding: 0;
  overflow: hidden;
  color: #d9e7ee;
  border: 1px solid rgba(61, 211, 207, .42);
  border-radius: 12px;
  background: rgba(4, 16, 29, .96);
  box-shadow: 0 18px 46px rgba(0, 0, 0, .56), inset 0 0 35px rgba(40, 210, 198, .08);
  backdrop-filter: blur(14px);
}
.jarvis-gesture-window .jarvis-gesture-window__bar {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 31px;
  margin: 0;
  padding: 0 5px 0 7px;
  cursor: grab;
  user-select: none;
  background: linear-gradient(180deg, rgba(36, 206, 200, .17), rgba(2, 10, 18, .66));
  border-bottom: 1px solid rgba(76, 219, 214, .19);
}
.jarvis-gesture-window .jarvis-gesture-window__bar.is-dragging { cursor: grabbing; }
.jarvis-gesture-window__grip { color: #42d8d3; font-size: 13px; letter-spacing: -2px; opacity: .8; }
.jarvis-gesture-window .jarvis-gesture-window__bar strong { flex: 0 1 auto; min-width: 0; overflow: hidden; color: #e1f5f5; font-size: 12px; font-weight: 650; letter-spacing: .04em; text-overflow: ellipsis; white-space: nowrap; }
.jarvis-gesture-window__state { flex: 1 1 auto; min-width: 0; overflow: hidden; color: #46dfd4; font: 10px/1.2 ui-monospace, Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }
.jarvis-gesture-window__fps { color: rgba(169, 223, 223, .7); font: 9px/1.2 ui-monospace, Consolas, monospace; white-space: nowrap; }
.jarvis-gesture-window .jarvis-gesture-window__tool {
  display: grid;
  flex: 0 0 auto;
  width: 21px;
  min-width: 21px;
  height: 21px;
  min-height: 21px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(109, 191, 200, .3);
  border-radius: 5px;
  background: rgba(1, 10, 18, .55);
  color: #b9d8de;
  cursor: pointer;
  font: 14px/1 system-ui, sans-serif;
}
.jarvis-gesture-window .jarvis-gesture-window__tool:hover { border-color: #52e4dd; color: #f1ffff; }
.jarvis-gesture-window .jarvis-gesture-window__close { color: #e0b8bd; }
.jarvis-gesture-window__body { display: grid; gap: 8px; padding: 9px; }
.jarvis-gesture-window .camera-view { height: auto; min-height: 0; border: 1px solid rgba(116, 204, 213, .24); border-radius: 8px; }
.jarvis-gesture-window .camera-view video { width: 100%; aspect-ratio: 4 / 3; transform: scaleX(-1); }
.jarvis-gesture-window .camera-view canvas { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.jarvis-gesture-window .camera-view > #gesture-pose { display: none; }
.jarvis-gesture-window .gesture-progress { height: 2px; margin: 0; border-radius: 2px; background: rgba(119, 221, 244, .18); }
.jarvis-gesture-window .gesture-progress i { background: #45dcd5; box-shadow: 0 0 9px rgba(69, 220, 213, .65); }
.jarvis-gesture-window #gesture-message { min-height: 0; margin: 0; color: #dce9ee; font-size: 11px; line-height: 1.45; }
.jarvis-gesture-window .gesture-rules { margin: 0; color: #8da9b6; font-size: 10px; line-height: 1.45; }
.jarvis-gesture-window small { color: #7794a1; font-size: 9px; line-height: 1.35; }
.jarvis-gesture-window.is-minimized { width: min(276px, calc(100vw - 24px)); }
.jarvis-gesture-window.is-minimized .jarvis-gesture-window__body,
.jarvis-gesture-window.is-minimized .jarvis-gesture-settings { display: none; }
.jarvis-gesture-window.is-minimized .jarvis-gesture-window__grip,
.jarvis-gesture-window.is-minimized .jarvis-gesture-window__fps { display: none; }
.jarvis-gesture-window.is-minimized .jarvis-gesture-window__bar strong { font-size: 11px; }
.jarvis-gesture-window.is-minimized .jarvis-gesture-window__state { font-size: 9px; }
.jarvis-gesture-window__hints { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 0; gap: 4px; padding: 5px 1px 2px; overflow: visible; pointer-events: auto; background: transparent; }
.jarvis-gesture-window__hints span { min-width: 0; padding: 3px 2px; overflow: hidden; border: 1px solid rgba(105, 227, 218, .34); border-radius: 3px; background: rgba(1, 12, 21, .66); color: #5aeee5; font-size: 9px; line-height: 1.2; text-align: center; text-overflow: ellipsis; white-space: nowrap; text-shadow: 0 0 8px rgba(73, 225, 217, .42); }
.jarvis-gesture-window__all-hints { display: none; }
.jarvis-gesture-settings { max-height: min(52vh, 390px); overflow: auto; border-top: 1px solid rgba(70, 216, 211, .22); background: rgba(2, 11, 20, .98); }
.jarvis-gesture-settings.is-hidden { display: none; }
.jarvis-gesture-settings > header { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 6px; margin: 0; padding: 7px 9px; background: rgba(5, 20, 31, .99); border-bottom: 1px solid rgba(110, 203, 205, .2); }
.jarvis-gesture-settings > header strong { flex: 1; font-size: 11px; letter-spacing: .05em; }
.jarvis-gesture-settings__list { display: grid; gap: 4px; padding: 7px 9px; }
.jarvis-gesture-settings__row { display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: center; gap: 7px; color: #b8cbd4; font-size: 10px; }
.jarvis-gesture-settings__row select { width: 100%; height: 24px; border: 1px solid rgba(106, 194, 201, .32); border-radius: 4px; background: #07131f; color: #e0eff3; font: 10px system-ui, sans-serif; }
.jarvis-gesture-settings__row select:focus { outline: 1px solid #4be0d9; border-color: #4be0d9; }
.jarvis-gesture-settings > p { margin: 0; padding: 0 9px 8px; color: #78939e; font-size: 9px; }

/* The JARVIS engine creates this cursor dynamically. Keeping its original
   ring, core dot and state label makes the control visible beyond the camera
   preview, including over the 3D scene and paper nebula. */
#jv-hand-cursor {
  position: fixed;
  z-index: 2147483646;
  left: 0;
  top: 0;
  display: none;
  pointer-events: none;
  will-change: transform;
  isolation: isolate;
}
#jv-hand-cursor .hc-ring {
  position: absolute;
  display: block !important;
  width: 46px;
  height: 46px;
  margin: -23px 0 0 -23px;
  border: 2px dashed #42dcd5;
  border-radius: 50%;
  box-shadow: 0 0 16px rgba(66, 220, 213, .34), inset 0 0 12px rgba(66, 220, 213, .18);
  animation: jarvis-gesture-spin 6s linear infinite;
}
#jv-hand-cursor .hc-dot {
  position: absolute;
  display: block !important;
  width: 7px;
  height: 7px;
  margin: -3.5px 0 0 -3.5px;
  border-radius: 50%;
  background: #f5ffff;
  box-shadow: 0 0 15px 4px rgba(75, 232, 224, .76);
}
#jv-hand-cursor .hc-label {
  position: absolute;
  display: block !important;
  left: 30px;
  top: 12px;
  padding: 3px 6px;
  border: 1px solid rgba(84, 229, 220, .28);
  border-radius: 4px;
  background: rgba(2, 13, 22, .84);
  color: #82f6ef;
  font: 10px/1.15 ui-monospace, Consolas, monospace;
  white-space: nowrap;
  text-shadow: 0 0 9px rgba(73, 232, 223, .54);
}
#jv-hand-cursor.is-pinch .hc-ring { border-color: #f7c95e; transform: scale(.62); }
#jv-hand-cursor.is-grab .hc-ring { border-color: #fb767d; }
.jv-ripple {
  position: fixed;
  z-index: 2147483647;
  width: 22px;
  height: 22px;
  margin: -11px 0 0 -11px;
  border: 2px solid #4ee5dd;
  border-radius: 50%;
  box-shadow: 0 0 18px rgba(77, 230, 222, .72);
  pointer-events: none;
  animation: jarvis-gesture-ripple .56s ease-out forwards;
}
@keyframes jarvis-gesture-spin { to { transform: rotate(360deg); } }
@keyframes jarvis-gesture-ripple { from { transform: scale(.4); opacity: 1; } to { transform: scale(3); opacity: 0; } }
@media (max-width: 700px) {
  .jarvis-gesture-window.camera-panel { width: min(288px, calc(100vw - 24px)); right: 12px; bottom: 12px; }
  .jarvis-gesture-window__fps { display: none; }
}
@media (max-width: 360px) {
  .jarvis-gesture-window.is-minimized { width: calc(100vw - 16px); }
  .jarvis-gesture-window.is-minimized .jarvis-gesture-window__bar strong,
  .jarvis-gesture-window.is-minimized .jarvis-gesture-window__grip { display: none; }
}
