body { font-family: Arial, sans-serif; margin: 20px; color:#222; }
header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }


.card { width:320px; padding:20px; border:1px solid #ddd; border-radius:6px; background:#fff; margin: auto; }
.center { display:flex; height:90vh; align-items:center; justify-content:center; }
input, select { display:block; width:100%; margin:8px 0; padding:8px; box-sizing:border-box; }
button { padding:8px 12px; cursor:pointer; }
.tiles { display:flex; justify-content:center; gap:16px; margin-top:40px; }
.tile { width:200px; height:150px; display:flex; align-items:center; justify-content:center; border:1px dashed #aaa; text-decoration:none; color:#222; }
.form-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:12px; }
table { width:100%; border-collapse:collapse; margin-top:12px; }
th { background:#eee; }
.hidden { display: none; }
.form-row {
    width: 250px;
    margin-bottom: 8px;
}

.form-row input,
.form-row select {
    width: 100%;
    box-sizing: border-box;
}

.password-wrapper {
    position: relative;
}

.password-wrapper input {
    padding-right: 36px;
}

.password-eye {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    user-select: none;
    font-size: 16px;
}

.print-only {
  display: none;
}

@media print {
  .no-print {
    display: none;
  }
  .print-only {
    display: block;
    margin-top: 10px;
    font-size: 14px;
  }
}

@media print {
  .close,
  button {
    display: none !important;
  }
}

.shortcut-hint {
  font-size: 12px;
  color: #666;
  background: #f7f7f7;
  border-bottom: 1px solid #e0e0e0;
  padding: 6px 12px;
  font-family: Arial, sans-serif;
}

.shortcut-hint span {
  font-weight: 600;
  color: #333;
}

@media print {
  .shortcut-hint {
    display: none;
  }
}